wangluohuoyun-huozhuapp/pages/mine/company/addcompany.vue

<template>
	<view class="content">
		<!-- <web-view :src="srcHandler()" v-if="isSshowPlayVideo"></web-view> -->
		<!-- 		<u-navbar leftText="返回" title="企业认证" :safeAreaInsetTop="true">
			<view class="u-nav-slot" slot="left">
				<u-icon @click='navback' name="arrow-left" size="19"></u-icon>
			</view>
			<view class="u-nav-slot" slot="right">
				<view @click="goDetailPage('/pages/mine/company/addcompanythree')" class='next'>下一步</view>
			</view>
		</u-navbar> -->
		<view v-show="videoPlay">
			<video controls id="myvideo" :src="dataDetails.videoAddressUrl" @fullscreenchange="screenChange"></video>
		</view>
		<view style='margin:10px 0 0 19px;font-size:12px;color:#EF4034;'>注：企业认证仅限该企业法定代表人本人完成。</view>

		<view class='content1'>
			<view class="title">上传营业执照</view>
			<view style='position:relative;' @click="uploadImg(1)">
				<view v-if='!dataDetails.businessLicenseAddressUrl' class="picture picture7">
					<image class="xj-image" src="@/static/mine/ic_shanchuan@2x.png"></image>
					<view class="text">上传营业执照</view>
				</view>
				<view v-if='dataDetails.businessLicenseAddressUrl' @click.stop="uploadImg(1)"
					class="preview-card-img picture ">
					<view @click.stop="delCard(1)">
						<image class='del-card' src="@/static/images/common/quxiao@2x.png">
						</image>
					</view>
					<image class="" :src="dataDetails.businessLicenseAddressUrl" mode="aspectFit"></image>
				</view>
			</view>
			<view class="flex row">
				<view class="left-text">营业期限截止日期</view>
				<view style='font-size:14px;width:50%;' class='flex flex-space-between'
					@click="selectValidityPeriod(0)">
					<view :style="{'color':dataDetails.businessTermDate ? '#000':'#C6CBD5'}">
						{{dataDetails.businessTermDate?dataDetails.businessTermDate:'选择期限截止日期'}}
					</view>
					<view>
						<u-icon name="arrow-right" color="#7E7E7E" size="10"></u-icon>
					</view>
				</view>
			</view>
			<view class="flex row noborder">
				<view class="left-text">统一社会信用代码</view>
				<u--input placeholder="请输入统一社会信用代码" inputAlign='left' border="none"
					v-model="dataDetails.unifiedSocialCreditCode">
				</u--input>
			</view>

		</view>
		<view class='wrap'>
			<view class="flex border-bottom mt20 align-center">
				<view class="left">企业名称</view>
				<view class="flex right">
					<u--input placeholder="输入企业名称" inputAlign='left' border="none" v-model="dataDetails.companyName"
						@blur='companyNameBlur'>
					</u--input>
				</view>
			</view>
			<view class="flex border-bottom mt20 align-center">
				<view class="left">法定代表人姓名</view>
				<view class="flex right">
					<u--input placeholder="输入法定代表人姓名" inputAlign='left' border="none"
						v-model="dataDetails.legalPersonName">
					</u--input>
				</view>
			</view>
			<view class="flex border-bottom mt20 align-center">
				<view class="left">联系电话</view>
				<view class="flex right">
					<u--input disabledColor='#fff' placeholder="输入联系电话" inputAlign='left' border="none"
						v-model="dataDetails.phone">
					</u--input>
				</view>
			</view>
			<!-- <view class="flex mt20 align-center">
				<view class="left">注册实缴金额</view>
				<view class="flex right align-center">
					<u--input placeholder="输入企业注册实缴金额" inputAlign='left' border="none"
						v-model="dataDetails.registeredPaidAmount">
					</u--input>
					<view>万元</view>
				</view>
			</view> -->
		</view>
		<!-- http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4 -->
		<!-- dataDetails.videoAddressUrl -->
		<view class='content3' v-if="!dataDetails.videoAddressUrl"
			@click="goDetailPage('/pages/mine/company/companyvideo')">
			<view class="left-text">视频验证（打开摄像头并阅读提示文字）</view>
			<view class="video-icon">
				<u-icon size="40" name="camera-fill"></u-icon>
			</view>
		</view>
		<view class='content3' v-if="dataDetails.videoAddressUrl">
			<view class="flex row noborder mt20 flex-space-between">
				<view class="left-text">视频验证（点击按钮播放视频）</view>
				<view>
					<u-button type="primary" @click="goDetailPage('/pages/mine/company/companyvideo')" size="mini">重新上传
					</u-button>
				</view>
			</view>
			<!-- <video class="myVideo" :src="dataDetails.videoAddressUrl" controls></video> -->
			<view>
				<view class="video-icon">
					<u-icon size="40" name="play-circle-fill" @click="videoShow()"></u-icon>
				</view>
			</view>

		</view>

		<view class='content3'>
			<view class="flex row noborder mt20 flex-space-between">
				<view class="left-text">申请开通平台垫付运费业务</view>
				<view>
					<u-switch @change="change" v-model="value" inactiveColor='#ABB0BB' size="20"></u-switch>
				</view>
			</view>
		</view>
		<view v-if="value" class='content1'>
			<view class="flex row">
				<view class="left-text">企业用地是否自有</view>
				<view class="flex right">
					<u-radio-group placement="row" class="select-type" v-model="dataDetails.landOwnership">
						<u-radio :customStyle="radioCustomStyle" v-for="(item, index) in radiolist1" :key="index"
							:label="item.name" :name="item.name" @change="radioChange($event,item)" labelSize='12px'
							:iconSize='4'>
						</u-radio>
					</u-radio-group>
				</view>
			</view>
			<view class="title">{{dataDetails.landOwnership=='自有'?'上传房产证':'上传租赁合同（扫描件或图片）'}}</view>
			<view style='position:relative;'>
				<view v-if='!dataDetails.propertyAddressUrl' @click="uploadImg(2)" class="picture">
					<image class="xj-image" src="@/static/mine/company/tianjiazhaopian@3x.png"></image>
				</view>
				<view v-if='dataDetails.propertyAddressUrl' @click.stop="uploadImg(2)" style='position:relative;'
					class="preview-card-img picture">
					<view @click.stop="delCard(2)">
						<image class='del-card' src="@/static/images/common/quxiao@2x.png">
						</image>
					</view>
					<image class="uploadimage uploadimage-small" :src="dataDetails.propertyAddressUrl" mode="aspectFit">
					</image>
				</view>
			</view>
			<view v-if="dataDetails.landOwnership=='租赁'" class="flex border-bottom mt20 align-center">
				<view class="left-text">场地租赁截止日期</view>
				<view style='font-size:14px;width:50%;' class='flex flex-space-between'
					@click="selectValidityPeriod(1)">
					<view :style="{'color':dataDetails.siteLeaseDate ? '#000':'#C6CBD5'}">
						{{dataDetails.siteLeaseDate?dataDetails.siteLeaseDate:'选择日期'}}
					</view>
					<view>
						<u-icon name="arrow-right" color="#7E7E7E" size="10"></u-icon>
					</view>
				</view>
			</view>

		</view>
		<view class="content4">

			<view class="flex service align-center">
				<u--image @click='consent'
					:src="consentStatus==true?'../../../static/images/mine/duihao@2x.png':'../../../static/images/mine/wxz.png'"
					width="12px" height="12px"></u--image>
				我已阅读并同意
				<navigator
					url="/pages/sale/webview?can_share=false&url=https://liangxin.zthymaoyi.com/userAgreement.html"
					class="path" hover-class="navigator-hover">《服务协议》</navigator>和<navigator
					url="/pages/sale/webview?can_share=false&url=https://liangxin.zthymaoyi.com/screctAgreement.html"
					class="path" hover-class="navigator-hover">《隐私政策》</navigator>
			</view>
		</view>

		<view class='footer'>
			<!-- <view @click="goDetailPage('/pages/mine/company/addcompanythree')" class='newlyIncreased'>下一步</view> -->
			<view @click="submit" class='newlyIncreased'>提交</view>
		</view>
		<u-picker :show="isShowcardValidity" ref="uPicker" :columns="validityPeriod" @confirm="confirmValidityPeriod"
			@change="changeHandler" @cancel="isShowcardValidity=false">
		</u-picker>
		<u-action-sheet :actions="$helper.imgTypeList" :title="$helper.imgType" :show="isShowimgType"
			@select="imgTypeSelect" :closeOnClickOverlay="true" :closeOnClickAction="true" @close="isShowimgType=false">
		</u-action-sheet>
		<u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	import upload from '@/components/upload.vue';
	import uploadImage from '@/components/ossutil/uploadFile.js';
	export default {
		components: {},
		data() {
			return {
				videoPlay: false,
				isSshowPlayVideo: false,
				srcHandler() {
					return `/hybrid/html/play.html?src=${this.dataDetails.videoAddressUrl}`
				},
				consentStatus: false,
				ValidityPeriodType: '',
				value: false,
				radioCustomStyle: {
					margin: '0 0 0 20rpx'
				},
				radiolist1: [{
						name: '自有',
						disabled: false
					},
					{
						name: '租赁',
						disabled: false
					},

				],
				isShowcardValidity: false,
				uploadType: '',
				index: '',
				isShowimgType: false,
				validityPeriod: [],
				checked: false,
				checked1: false,
				dataDetails: {
					phone: '',
					businessLicenseAddressUrl: '',
					propertyAddressUrl: '',
					advanceFreightService: 0,
					landOwnership: '自有',
					videoAddressUrl: null,
					legalPersonName: ''

				}
			}
		},
		onShow() {
			console.log(uni.getStorageSync("videoSrc"))
			var viderSrc = uni.getStorageSync("videoSrc")
			if (viderSrc) {
				this.dataDetails.videoAddressUrl = viderSrc
			}

		},
		onLoad(options) {
			this.validityPeriod = this.$helper.makeValidityPeriod(0, '长期')
			console.log(this)
			this.dataDetails.commonId = this.userInfo.id
			this.dataDetails.phone = this.userInfo.phone
			console.log('```````````````')
			console.log(options)
			if (uni.getStorageSync('companydata')) {
				this.dataDetails = JSON.parse(uni.getStorageSync('companydata'))
				if (!this.dataDetails.businessLicenseAddressUrl) {
					this.dataDetails.businessLicenseAddressUrl = ""
				}
			}
			this.dataDetails.videoAddressUrl = options.videoSrc
			this.getName()
		},
		computed: {
			...mapState(['hasLogin', 'userInfo']),
		},
		methods: {
			screenChange(e) {
				let fullScreen = e.detail.fullScreen; // 值true为进入全屏，false为退出全屏
				console.log(e, "全屏");
				if (!fullScreen) {
					//退出全屏
					this.videoPlay = false; // 隐藏播放盒子
				}
			},
			// 触发全屏播放的点击事件
			videoShow() {
				this.videoContext = uni.createVideoContext("myvideo", this); // this这个是实例对象 必传
				this.videoContext.requestFullScreen({
					direction: 270
				});
				this.videoContext.play();
				console.log(this.videoContext)
				this.videoPlay = true; // 显示播放盒子
			},
			// getList(){
			// 	uni.showLoading({
			// 		title: '加载中',
			// 		mask:true
			// 	})
			// 	var _this=this
			// 	this.$request.baseRequest('get', '/companyInfo/getCompanyInfo', {id:this.dataDetails.id}).then(res => {
			// 		uni.hideLoading()
			// 		_this.dataDetails=res.data
			// 	})
			// 	.catch(res => {
			// 		uni.hideLoading()
			// 		uni.showToast({
			// 			title: res.message,
			// 			icon: 'none',
			// 			duration: 2000
			// 		})
			// 	});
			// },
			companyNameBlur() {
				this.$request.baseRequest('get', '/companyInfo/repeatCompanyInfo', {
						commonId: this.userInfo.id,
						companyName: this.dataDetails.companyName
					}).then(res => {
						if (res.code == 200) {
							// that.dataDetails.legalPersonName = res.data.name
						} else {
							uni.showToast({
								title: res.message,
								icon: 'none',
								duration: 2000
							})
						}
					})
					.catch(res => {
						uni.hideLoading()
						uni.showToast({
							title: res.message,
							icon: 'none',
							duration: 2000
						})
					});
			},
			getName() {
				let that = this
				this.$request.baseRequest('get', '/cargoOwnerInfo/selectCargoOwner', {
						commonId: this.userInfo.id
					}).then(res => {
						if (res.code == 200) {
							that.dataDetails.legalPersonName = res.data.name
						}
					})
					.catch(res => {
						uni.hideLoading()
						uni.showToast({
							title: res.message,
							icon: 'none',
							duration: 2000
						})
					});
			},
			loadedmetadata(event) {
				console.log(event)
			},
			loadeddata(event) {
				console.log(event)
			},
			videoErrorCallback: function(e) {
				uni.showModal({
					content: e.target.errMsg,
					showCancel: false
				})
			},
			validate() {
				if (uni.$u.test.isEmpty(this.dataDetails.companyName)) {
					this.$refs.uToast.show({
						type: 'error',
						message: "企业名称不能为空！",
					})
					return true
				}
				if (this.dataDetails.companyName.length < 4 || this.dataDetails.companyName.length > 25) {
					this.$refs.uToast.show({
						type: 'error',
						message: "企业名称字数在4-25个字！",
					})
					return true
				}
				if (uni.$u.test.isEmpty(this.dataDetails.legalPersonName)) {
					this.$refs.uToast.show({
						type: 'error',
						message: "法定代表人姓名不能为空！",
					})
					return true
				}
				if (uni.$u.test.isEmpty(this.dataDetails.phone)) {
					this.$refs.uToast.show({
						type: 'error',
						message: "联系电话不能为空！",
					})
					return true
				}
				// if (uni.$u.test.isEmpty(this.dataDetails.registeredPaidAmount)) {
				// 	this.$refs.uToast.show({
				// 		type: 'error',
				// 		message: "注册实缴金额不能为空！",
				// 	})
				// 	return true
				// }
				if (uni.$u.test.isEmpty(this.dataDetails.businessLicenseAddressUrl)) {
					this.$refs.uToast.show({
						type: 'error',
						message: "营业执照不能为空！",
					})
					return true
				}
				if (uni.$u.test.isEmpty(this.dataDetails.businessTermDate)) {
					this.$refs.uToast.show({
						type: 'error',
						message: "营业期限截止日期不能为空！",
					})
					return true
				}
				if (uni.$u.test.isEmpty(this.dataDetails.unifiedSocialCreditCode)) {
					this.$refs.uToast.show({
						type: 'error',
						message: "统一社会信用代码不能为空！",
					})
					return true
				}

				if (this.dataDetails.advanceFreightService == 1 && uni.$u.test.isEmpty(this.dataDetails
						.propertyAddressUrl)) {
					this.$refs.uToast.show({
						type: 'error',
						message: "房产证或租赁合同不能为空！",
					})
					return true
				}

				if (this.dataDetails.advanceFreightService == 1 && this.dataDetails.landOwnership == '租赁') {
					if (uni.$u.test.isEmpty(this.dataDetails.siteLeaseDate)) {
						this.$refs.uToast.show({
							type: 'error',
							message: "场地租赁截止日期不能为空！",
						})
						return true
					}
				}
				// if (uni.$u.test.isEmpty(this.dataDetails.videoAddressUrl)) {
				// 	this.$refs.uToast.show({
				// 		type: 'error',
				// 		message: "视频认证不能为空！",
				// 	})
				// 	return true
				// }
			},
			submit() {
				if (this.validate()) return
				uni.showLoading({
					title: '加载中',
					mask: true
				})
				var _this = this
				this.$request.baseRequest('post', '/companyInfo/api/addCompanyInfo', _this.dataDetails).then(res => {
						uni.hideLoading()
						uni.$u.toast('提交成功')
						uni.removeStorageSync("videoSrc")
						uni.navigateBack({
							delta: 1
						})

					})
					.catch(res => {
						uni.hideLoading()
						uni.showToast({
							title: res.message,
							icon: 'none',
							duration: 2000
						})
					});
			},
			consent() {
				this.consentStatus = !this.consentStatus
			},
			change(e) {
				if (this.value) {
					this.$set(this.dataDetails, 'advanceFreightService', 1)
				} else {
					this.$set(this.dataDetails, 'advanceFreightService', 0)
				}
			},
			radioChange(n) {
				console.log('radioChange', n);
				this.dataDetails.landOwnership = n
				console.log('this.dataDetails.landOwnership', this.dataDetails.landOwnership);
			},
			delCard(type) {
				if (type == 1) {} else {

				}
				this.dataDetails.businessLicenseAddressUrl = ''
				this.$forceUpdate()
			},
			navBack() {
				uni.navigateBack();
			},
			checkedchange() {
				this.checked = !this.checked
				if (this.checked) {
					this.dataDetails.landOwnership = 0
					this.checked1 = false
				} else {

				}
			},
			checkedchange1() {
				this.checked1 = !this.checked1
				if (this.checked1) {
					this.dataDetails.landOwnership = 1
					this.checked = false
				} else {

				}
			},
			clickcancel() {
				this.isShowcardValidity = false
			},
			imgTypeSelect(val) {
				var _this = this
				if (val.name == '相册') {
					uni.chooseImage({
						count: 1,
						sourceType: this.$helper.chooseImage.sourceType,
						success: function(res) {
							console.log(JSON.stringify(res.tempFilePaths));
							uploadImage('image', res.tempFilePaths[0], 'appData/',
								result => {
									// 上传成功回调函数
									console.log('图片地址', result)

									switch (_this.uploadType) {
										// 身份正面
										case 1:
											_this.dataDetails.businessLicenseAddressUrl = result
											// 识别
											_this.$request.baseRequest('get',
													'/cargoOwnerInfo/api/licenseShibie', {
														licenseImg: result,
													}).then(res => {
													if (res.code == '200') {
														if (res.data.validPeriod == '29991231') {
															_this.dataDetails.businessTermDate = '长期'
														}
														_this.dataDetails.unifiedSocialCreditCode = res
															.data.regNum
														_this.dataDetails.legalPersonName = res.data
															.licensePerson
														_this.dataDetails.companyName = res.data
															.licenseName
														console.log(res)
														_this.$forceUpdate()
													}

												})
												.catch(res => {
													uni.$u.toast(res.message);
												});
											console.log(_this.dataDetails.businessLicenseAddressUrl)
											break
											// 身份反面
										case 2:
											_this.dataDetails.propertyAddressUrl = result
											console.log(_this.dataDetails.propertyAddressUrl)
											break
										case 3:
											break;
									}
								}
							)
						}
					});
				} else {
					uni.chooseImage({
						count: 1,
						sourceType: ['camera'],
						success: function(res) {
							console.log(JSON.stringify(res.tempFilePaths));
							uploadImage('image', res.tempFilePaths[0], 'appData/',
								result => {
									// 上传成功回调函数
									console.log('图片地址', result)
									switch (_this.uploadType) {
										// 身份正面
										case 1:
											// 识别
											_this.$request.baseRequest('get',
													'/cargoOwnerInfo/api/licenseShibie', {
														licenseImg: result,
													}).then(res => {
													if (res.code == '200') {
														if (res.data.validPeriod == '29991231') {
															_this.dataDetails.businessTermDate = '长期'
														}
														_this.dataDetails.unifiedSocialCreditCode = res
															.data.regNum
														_this.dataDetails.legalPersonName = res.data
															.licensePerson
														_this.dataDetails.companyName = res.data
															.licenseName
														console.log(res)
														_this.$forceUpdate()
													}

												})
												.catch(res => {
													uni.$u.toast(res.message);
												});
											_this.dataDetails.businessLicenseAddressUrl = result
											console.log(_this.dataDetails.businessLicenseAddressUrl)
											break
											// 身份反面
										case 2:
											_this.dataDetails.propertyAddressUrl = result
											console.log(_this.dataDetails.propertyAddressUrl)
											break
										case 3:
											break;
									}
								}
							)
						}
					});
				}
			},
			uploadImg(type) {
				this.uploadType = type
				this.isShowimgType = true
				// this.index = index
			},
			goDetailPage(src) {
				uni.setStorageSync('companydata', this.dataDetails);
				uni.$u.route(src);
			},
			selectValidityPeriod(type) {
				this.ValidityPeriodType = type
				this.isShowcardValidity = true
			},
			confirmValidityPeriod(e) {
				switch (this.ValidityPeriodType) {
					case 0:
						if (e.value[0] == '长期') {
							this.dataDetails.businessTermDate = e.value[0]
						} else {
							this.dataDetails.businessTermDate = e.value[0] + '-' + e.value[1] + '-' + e.value[2]
						}
						break
					case 1:
						if (e.value[0] == '长期') {
							this.dataDetails.siteLeaseDate = e.value[0]
						} else {
							this.dataDetails.siteLeaseDate = e.value[0] + '-' + e.value[1] + '-' + e.value[2]
						}
						break
				}
				console.log('confirm', e)


				this.isShowcardValidity = false
			},
			changeHandler(e) {
				const {
					columnIndex,
					value,
					values,
					index,
					picker = this.$refs.uPicker
				} = e

				// if (columnIndex === 0) {
				// 	
				// 	if (e.index != 0) {
				// 		picker.setColumnValues(1, this.validityPeriod[1].shift())
				// 	}

				// } else if (columnIndex === 1) {
				// 	if (e.index != 0) {
				// 		picker.setColumnValues(2, this.validityPeriod[2].shift())
				// 	}
				// }
			},
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		padding: 0 0 200rpx 0;
	}

	page {
		background: #F5F6FA;
	}

	/deep/uni-image.uploadimage-small {
		width: 100% !important;
	}

	.next {
		color: #2772FB;
		font-size: 13px;
	}

	.wrap {
		background: #fff;
		padding: 20rpx 30rpx;
		border-radius: 5px;
		margin: 20rpx;

		.left {
			width: 240rpx;
			font-size: 28rpx;
		}

		.right {
			font-size: 28rpx;
			width: calc(100% - 240rpx);
		}
	}

	.preview-card-img {
		// /deep/uni-image>div, uni-image>img {
		//     transform: scale(1.5) rotate(-90deg);
		// }
	}

	.picture {
		margin-top: 20rpx;
		background: #F5F6FA;
		width: 212rpx;
		height: 212rpx;
		border-radius: 20rpx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		color: #6A7282;
	}

	.content1 {
		background: #fff;
		padding: 20rpx;
		margin: 20rpx;
		border-radius: 10rpx;

		.row {
			border-bottom: 1px solid #EEEEEE;
			padding-bottom: 28rpx;
			margin-top: 26rpx;

		}

		.left-text {
			// background: red;
			width: 320rpx;
			color: #333333;
			display: flex;
			align-items: center;
			font-size: 14px;
		}

		.picture {
			position: relative;
			width: 100%;
			height: 440rpx;
			display: flex;
			justify-content: center;
			flex-direction: column;
			align-items: center;

			.text {
				margin-top: 20rpx;
			}
		}

		.picture7 {
			background: url(../../../static/mine/cy.png);
			background-size: 100% 100%;
		}


		.xj-image {
			width: 100rpx;
			height: 100rpx;
		}

		.title {
			color: #333333;
			margin: 20rpx 0;
		}
	}

	.content2,
	.content3,
	.content4 {
		background: #fff;
		padding: 20rpx;
		margin: 20rpx;
		border-radius: 10rpx;
	}

	.u-input {
		font-size: 16px;
	}

	.content4 {}

	.del-card {
		position: absolute;
		top: -10rpx;
		right: -6rpx;
		width: 80rpx;
		height: 80rpx;
		z-index: 9;
	}

	.footer {
		position: fixed;
		background: #fff;
		width: 100%;
		bottom: 0;
		left: 0;
		padding: 40rpx 60rpx;
		box-sizing: border-box;
		z-index: 9999;
	}

	.newlyIncreased {
		width: 100%;
		height: 80rpx;
		margin: 0 auto;
		text-align: center;
		color: #fff;
		background: #2772FB;
		background-size: 100%;
		border-radius: 50rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.u-checkbox-label--left {
		margin: 0 10px;
	}

	.service {
		font-size: 24rpx;
		margin: 20rpx;
		justify-content: center;

		/deep/.u-image {
			margin: 0 20rpx;
		}
	}

	.video-icon {
		margin-top: 20rpx;
		background: #F5F6FA;
		width: 212rpx;
		height: 211rpx;
		border-radius: 20rpx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		color: #6A7282;
	}

	.myVideo {}
</style>