<template>
	<!-- #ifdef MP -->
	<view :style="viewColor">
		<!-- #endif -->
		<!-- #ifdef APP || H5 -->
		<view :style="viewColor">
			<!-- #endif -->
			<form @submit="formSubmit" report-submit='true'>
				<view class="release_content">
					<view class="release_tab acea-row">
						<view class="tab_item" v-for="(item, index) in tabList" :key="item.value"
							:class="{on:tabActive == item.value}" @click="changeTab(item)">
							<text class="iconfont" :class="item.icon"></text>{{item.name}}
						</view>
					</view>
					<view>
						<view class="release_item">
							<view class="photo_count">
								<view class="input_photo acea-row row-middle">
									<block v-if="tabActive == 2">
										<view class="pictrue" v-if="formData.video_link">
											<view v-if="videoplay">
												<video controls id="myvideo" :src="video_link"
													@fullscreenchange="screenChange"></video>
											</view>
											<!--#ifndef APP-PLUS-->
											<video class="pictrue" :src="formData.video_link"></video>
											<!--#endif-->
											<image class="video-bg" mode="widthFix"
												src="https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/luzhou/static4/3/video_bg.png">
											</image>
											<view class="videoHover" @click="videoshow">
												<view>
													<text class="iconfont icon-24gf-play"></text>
												</view>
											</view>
											<text class="video-text">点击可预览视频</text>

											<view class="close_btn" @click="delVideo"><text
													class="iconfont icon-guanbi4"></text></view>
										</view>
										<view v-else class="pictrue acea-row row-center-wrapper row-column add"
											@click="uploadVideo">
											<view><text class='iconfont icon-tianjiashipin'></text></view>
											<view class="text">添加视频</view>
										</view>
										<view v-if="formData.image.length < 1"
											class="pictrue acea-row row-center-wrapper row-column add"
											@click.stop="clk">
											<view><text class='iconfont icon-fengmian'></text></view>
											<view class="text">添加封面</view>
										</view>
									</block>
									<view class="pictrue" v-for="(item, index) in formData.image" :key="index">
										<easy-loadimage mode="widthFix" :image-src="item"></easy-loadimage>
										<text class="cover_text" v-if="tabActive == 2">封面</text>
										<view class="close_btn" @click="DelPic(index)"><text
												class="iconfont icon-guanbi4"></text></view>
									</view>
									<block v-if="tabActive == 1">
										<view v-if="formData.image.length < 6"
											class="pictrue acea-row row-center-wrapper row-column add"
											@click.stop="clk">
											<view><text class='iconfont icon-icon25201'></text></view>
											<view class="text">添加图片</view>
										</view>
									</block>
									<view v-if="showCd" :ratio="16/9" class="container">
										<bt-cropper ref="cropper" :imageSrc="imageSrc" @cropEnd="loadImage"
											:dWidth="800" :compress="true">
											<!-- 你想插入的内容 -->
											<button class="crop_btn" @click="crop">裁切</button>
										</bt-cropper>
									</view>
								</view>
							</view>
							<view class="textarea">
								<textarea placeholder='请输入商品描述' name="comment" placeholder-class='placeholder'
									v-model="formData.content" maxlength="600"></textarea>
							</view>
						</view>
						<view class="release_item">
							<view class='item acea-row row-between-wrapper'>
								<view class='name'><text
										class="iconfont icon-baobeilianjie"></text>添加产品({{productList.length}})</view>
								<view class="select">
									<view class="select_count" @click.stop="addProduct">
										<text v-if="productList.length == 0" class="text">选择产品</text>
										<view v-else class="text">
											<image class="image" v-for="(item,index) in productList" :key="index"
												:src="item.image || (item.spu && item.spu.image)"></image>
										</view>
										<text class="iconfont icon-xiangyou"></text>
									</view>
								</view>
							</view>
							<view class='item acea-row row-between-wrapper'>
								<view class='name'
									style="font-size: 28rpx;rfont-family: PingFang SC;font-weight: 400;color: #F84221;">
									价格：￥{{price.toFixed(2)}}</view>
								<!-- <view class="select">
									<view class="select_count" @click="addprice">
										<text v-if="!isshow" class="text1">点击输入价格</text>
										<view v-else >
											<input type="number" value="" v-model="price" placeholder="请输入价格"
												style="text-align: right;font-size: 28rpx;" />
										</view>

									</view>
								</view> -->
							</view>
							<view class="popup_group" v-if='this.formData.product_info'>
								<view class="radio" v-if="this.formData.product_info.length>0">
									<view class="radio_label ">送货方式</view>
									<checkbox-group class="select_group flex_start" @change="deliveryWayChange">
										<label class="radio_select" v-for="(val, i) in deliveryFreeList"
											:key="val.value">
											<view>
												<checkbox :value="val.value"
													:checked="delivery_way.includes(val.value)" />
											</view>
											<view>{{ val.name }}</view>
										</label>
									</checkbox-group>
								</view>

								<!-- 	<view class="popup_group_item" v-if="delivery_way.includes('2')">
									<view class="popup_group_item_label">是否包邮</view>
									<view class="popup_group_item_value">
										<view class="popup_group_item_message">
											<switch :checked="delivery_free == '1'" color="#E93323"
												style="transform:scale(0.8)" @change="deliveryFreeChange" />
										</view>
									</view>
								</view> -->

								<!-- 		<view class="popup_group_item" v-if="delivery_way.includes('2') && delivery_free == 0"
									@click="tempIdSelect">
									<view class="popup_group_item_label">运费模板</view>
									<view class="popup_group_item_value">
										<view class="popup_group_item_message">
											<span v-if="setFormData.tempName"
												class="popup_group_item_message_value">{{ setFormData.tempName }}</span>
											<span v-else>请选择运费模板</span>
										</view>
										<view><span class="iconfont">&#xe6bd;</span></view>
									</view>
								</view> -->
							</view>


						</view>
					</view>
					<button class="release_btn button" form-type="submit">发布</button>
				</view>
			</form>
			<!--视频预览弹窗-->
			<view v-if="showVideo" class="video-count">
				<!--#ifndef APP-PLUS-->
				<video id="myVideo" class="videoLink" autoplay loop muted :src="formData.video_link"></video>
				<!--#endif-->
				<!--#ifdef APP-PLUS-->

				<video id="myVideo" class="videoLink" autoplay loop
					:src='formData.video_link && (formData.video_link.substring(0,4) == "http" || formData.video_link.substring(0,5) == "https") ? formData.video_link : "http:" + formData.video_link'></video>
				<!--#endif-->
			</view>
			<view class='mask' catchtouchmove="true" :hidden='showVideo==false' @tap="showVideo=false"></view>
			<avatar @upload="doUpload" @getName="getImgName" quality="1" ref="avatar" selWidth="250upx"
				selHeight="250upx">
			</avatar>
			<!-- 提到的宝贝弹窗 -->
			<uni-popup ref="associated" type="bottom">
				<associated @close="close" @getProduct="getProduct" :checkedObj="productList"></associated>
			</uni-popup>

			<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse">
			</authorize>


		</view>
</template>

<script>
	import mTabbar from '@/components/m-tabbar/m-tabbar.vue'

	import {
		mapGetters
	} from "vuex";
	import authorize from '@/components/Authorize';
	import avatar from "@/components/yq-avatar/yq-avatar.vue";
	import associated from '@/components/shoppinglist/shoppinglist.vue';

	import {
		TOKENNAME,
		HTTP_REQUEST_URL
	} from '@/config/app.js';
	import {
		createPlantApi,
		updatePlantApi,
		plantDetailApi,
		orderAssociatePlantApi
	} from "@/api/community";
	import {
		setStorage,
		getStorage
	} from '@/libs/uniApi.js';
	import easyLoadimage from '@/components/easy-loadimage/easy-loadimage.vue';
	import {
		configMap
	} from '@/utils';
	import {
		getCommunitycreate,
		getresaleDetail,
		getresaleEdit
	} from '@/api/trading-floor.js'

	import {

		getUserInfo
	} from '@/api/user.js'
	import store from '@/store';
	export default {
		components: {
			avatar,
			associated,
			authorize,
			easyLoadimage,
			mTabbar,

		},
		data() {
			return {
				formData: {
					image: [],
					content: "",
					topic_id: 0,
					category_id: 0,
					video_link: '',
					is_type: 3,
					resale_type: 1,
					product_info: []
				},
				price: 0,
				deliveryFreeList: [{
						value: '1',
						name: '到店核销'
					},
					{
						value: '2',
						name: '快递配送'
					}
				],
				imageSrc: '',
				productList: [],
				topicName: {},
				isUpload: true,
				isAuto: false, //没有授权的不会自动授权
				isShowAuth: false, //是否隐藏授权
				showCd: false,
				isshow: false,
				id: "",
				order_id: "",
				imgName: "",
				upload_max: 50,
				uploadUrl: `${HTTP_REQUEST_URL}/api/upload/video`,
				tabList: [{
						name: '图文',
						value: 1,
						icon: 'icon-tuwen'
					},
					{
						name: '视频',
						value: 2,
						icon: 'icon-shipin'
					},
				],
				tabActive: 1,
				isPlay: false,
				videoContext: "",
				video_link: "",
				showVideo: false,
				videoplay: false,
				videoContext: '',
				delivery_free: 1,
				templateListPage: {
					page: 1,
					limit: 10000
				},
				merId: '',
				delivery_way: [], // 配送方式 1 到店核销 2 快递配送
				type: ''

			};
		},
		computed: {
			...mapGetters(['isLogin', 'viewColor', 'uid']),
			...configMap({
				community_app_switch: []
			})
		},
		watch: {
			// formData:{
			// 	handler(n){
			// 		if(!this.id){
			// 			setTimeout(()=>{
			// 				setStorage('addPlant', n);
			// 			});
			// 		}
			// 	},
			// 	deep: true
			// }
		},
		mounted() {
			// #ifndef APP-PLUS
			this.videoContext = uni.createVideoContext('myVideo', this);
			// #endif
			this.getUserInfo()
		},
		onLoad(options) {
			// uni.hideTabBar()
			// console.log(this.isLogin, "sdfsdkfhjsdhgfsdf")
			// return
			this.id = options.id;
			this.type = options.gtype

			this.tabActive = options.type || 1;
			if (this.community_app_switch.length == 1) {
				this.tabActive = this.community_app_switch[0]
			}
			if (!this.isLogin) {
				this.isAuto = true;
				this.isShowAuth = true
			} else {


			}
			if (this.type) {
				this.list()
				uni.setNavigationBarTitle({
					title: '编辑调货'
				})
			}
			this.videoContext = uni.createVideoContext("myvideo", this);
		},
		onTabItemTap() {
			this.$refs.associated.close();
			this.formData.content = ''
			this.formData.image = []
			this.formData.topic_id = ''
			this.formData.video_link = ''
			this.productList = []
			this.topicName = {}
		},

		methods: {
			list() {
				getresaleDetail(this.id).then(res => {
					if (res.data.status = 200) {
						this.formData = res.data
						this.productList = res.data.resale
						this.formData.product_info = []
						for (let i in res.data.resale) {
							this.price = Number(this.price) + (Number(res.data.resale[i].number) * Number(res.data
								.resale[i].price))
							this.delivery_way = res.data.resale[i].deliver_method.split('')
						}

						this.getProduct(res.data.resale)
						if (res.data.video_link) {
							this.tabActive = 2
						}
					}
				})
			},
			getUserInfo: function() {
				let that = this;
				getUserInfo().then(res => {
					this.merId = res.data.service.mer_id

				})


			},
			// 是否包邮选择
			deliveryFreeChange(val) {
				if (val.detail.value) {
					this.delivery_free = '1';
				} else {
					this.delivery_free = '0';
				}
			},
			// 送货方式选择
			deliveryWayChange(obj) {
				this.delivery_way = obj.detail.value;
				if (this.formData.product_info.length > 0) {
					for (let i in this.formData.product_info) {
						this.formData.product_info[i].deliver_method = obj.detail.value.toString();
					}
				} else {
					this.$util.Tips({
						title: '请选择产品,再选择送货方式'
					});
				}


			},

			onLoadFun() {
				this.isShowAuth = false;
			},
			// 授权关闭
			authColse: function(e) {
				this.isShowAuth = e;
			},

			/*点击输入价格*/
			addprice() {
				this.isshow = true
			},
			/*切换tab*/
			changeTab(item) {
				if (this.tabActive == item.value) return
				this.tabActive = item.value
				this.productList = []
				this.price = 0
				this.formData = {
					image: [],
					content: "",
					topic_id: 0,
					category_id: 0,
					video_link: '',
					is_type: 3,
					product_info: []
				}
			},

			clk() {
				let that = this
				uni.chooseImage({
					count: 1,
					sizeType: ['original'],
					success: (res) => {
						// console.log(res)
						let tempFilePaths = res.tempFilePaths[0]
						//#ifdef APP-PLUS
						if (uni.getSystemInfoSync().platform == 'ios') {
							that.doUpload(tempFilePaths)
						} else {
							let size = res.tempFiles[0].size / 1024
							if (size >= 1) {
								uni.compressImage({
									src: tempFilePaths,
									quality: 80, // 仅对jpg有效
									success: res => {
										that.imageSrc = res.tempFilePath;
										that.showCd = true;
									},
									fail: err => {
										// console.log('失败了compressImage', tempFilePaths);
										that.imageSrc = tempFilePaths
										that.showCd = true
									}
								})
							} else {
								that.imageSrc = tempFilePaths
								that.showCd = true
							}
						}
						//#endif
						//#ifndef APP-PLUS
						that.imageSrc = tempFilePaths
						that.showCd = true
						//#endif
					}
				})
			},
			crop() {
				uni.showLoading({
					title: '',
					mask: true
				})
				// 通过组件定义的ref调用cropper方法，返回一个promise对象
				this.$refs.cropper.crop().then(([err, res]) => {
					if (!err) {
						uni.hideLoading()
						this.doUpload(res.tempFilePath)
					} else {
						uni.hideLoading()
						// console.log(err)
					}
				})
			},
			loadImage() {
				this.showCd = false
			},
			doUpload(rsp) {
				let that = this
				uni.showLoading({
					title: '上传中',
					mask: true
				})
				uni.uploadFile({
					url: HTTP_REQUEST_URL + '/api/upload/image/field',
					filePath: rsp,
					name: 'field',
					formData: {
						'filename': rsp,
						'name': that.imgName
					},
					header: {
						// #ifdef MP
						"Content-Type": "multipart/form-data",
						// #endif
						[TOKENNAME]: 'Bearer ' + store.state.app.token
					},
					success: (uploadFileRes) => {
						let imgData = JSON.parse(uploadFileRes.data)
						if (imgData.data.path) {
							that.formData.image.push(imgData.data.path)
							uni.hideLoading()
						}
					},
					complete(res) {
						let data = JSON.parse(res.data)
						// that.$util.Tips({
						// 	title: data.message
						// });
					}
				});
			},
			// 上传视频
			uploadVideo() {
				let that = this
				uni.chooseVideo({
					sourceType: ['camera', 'album'],
					success: res => {
						if (Math.ceil(res.size / 1024) < that.upload_max * 1024) {
							uni.uploadFile({
								url: that.uploadUrl, //仅为示例，非真实的接口地址
								filePath: res.tempFilePath,
								name: 'file',
								//请求参数
								formData: {
									user: 'test'
								},
								header: {
									// #ifdef MP
									'Content-Type': 'multipart/form-data',
									// #endif
									[TOKENNAME]: 'Bearer ' + store.state.app.token
								},
								success: uploadFileRes => {
									let data = JSON.parse(uploadFileRes.data);
									that.formData.video_link = (data.data.src);
								},
								complete: a => {

								}
							});
						} else {
							uni.showModal({
								title: '提示',
								content: `视频超出限制${that.upload_max}MB,已过滤`
							});
						}
					},
					fail: err => {
						that.$util.Tips({
							title: err
						});
					}
				});
			},
			getImgName(name) {
				this.imgName = name
			},
			/**删除图片*/
			DelPic: function(index) {
				let that = this
				that.formData.image.splice(index, 1);
			},
			/*删除视频*/
			delVideo() {
				this.formData.video_link = '';
			},
			/*添加宝贝*/
			addProduct() {

				this.$refs.associated.open();
			},

			close() {
				this.$refs.associated.close();

			},
			/*查看视频*/
			videoshow() {
				this.showVideo = true
				this.videoContext = uni.createVideoContext('myVideo', this);
				this.$nextTick(() => {
					this.videoContext.play();
				})
				// this.video_link = this.formData.video_link;
				// this.videoContext.requestFullScreen({ direction: 90 });
				// this.videoContext.play(); this.videoplay = true; 
			},
			screenChange(e) {
				let fullScreen = e.detail.fullScreen; //值true为进入全屏，false为退出全屏 
				// console.log(e, "qweeee========================================");
				if (!fullScreen) {
					this.videoplay = false
					//退出全屏 this.videoplay = false; // 隐藏播放盒子 
				}
			},
			/*获取选中的宝贝*/
			getProduct(data) {
				if (this.type == 'edit') {
					this.formData.product_info = []
				}
				this.productList = []
				this.price = 0;
				if (data.length > 0) {
					this.productList = data;
					for (let i in data) {
						this.price = Number(this.price) + (Number(data[i].number) * Number(data[i].price))
						this.formData.product_info.push({
							product_attr_unique: data[i].product_attr_unique,
							number: Number(data[i].number),
							price: data[i].price
						})
					}
				} else {
					this.price = 0
				}




				this.$refs.associated.close();
			},

			/**
			 * 提交数据
			 */
			formSubmit: function(e) {


				let that = this,

					value = that.formData;
				if (value.image.length == 0) return that.$util.Tips({
					title: '请添加图文图片'
				});
				if (value.product_info.length == 0) return that.$util.Tips({
					title: '请选择产品'
				});
				if (!value.content) return that.$util.Tips({
					title: '请添加商品描述'
				});
				// console.log( this.delivery_way.length>0 )
				if (!value.product_info[0].deliver_method && this.delivery_way.length == 0) return that.$util.Tips({
					title: '请选择配送方式'
				});

				if (that.tabActive == 2 && !value.video_link) {
					return that.$util.Tips({
						title: '请添加话题视频'
					});
				}
				uni.showLoading({
					title: '保存中',
					mask: true
				})


				that.type == 'edit' ? getresaleEdit(that.id, value).then(res => {
					if (res.status == '200') {
						uni.hideLoading()
						that.$util.Tips({
							title: '编辑成功',
							icon: 'success'
						});
						that.formData = {
							image: [],
							content: "",
							topic_id: 0,
							category_id: 0,
							video_link: '',
							is_type: 3,
							product_info: []
						}
						uni.redirectTo({
							url: '/pages/releaseManagement/index?key=' + 2
						})

					} else {
						that.$util.Tips({
							title: res.messge,
							icon: 'success'
						});
					}
				}).catch(err => {

					return that.$util.Tips({
						title: err
					});
				}) : getCommunitycreate(value).then(res => {
					if (res.status == '200') {
						uni.hideLoading()
						that.$util.Tips({
							title: '发布成功',
							icon: 'success'
						});
						that.formData = {
							image: [],
							content: "",
							topic_id: 0,
							category_id: 0,
							video_link: '',
							is_type: 3,
							product_info: []
						}
						uni.redirectTo({
							url: '/pages/releaseManagement/index?key=' + 2
						})

					} else {
						that.$util.Tips({
							title: res.messge,
							icon: 'success'
						});
					}
				}).catch(err => {

					return that.$util.Tips({
						title: err
					});
				})


			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background: #F5F5F5;
	}

	.crop_btn {
		line-height: 90rpx;
		height: 90rpx;
		height: calc(90rpx+ constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
		height: calc(200rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
	}

	.container {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 20;
		width: 750rpx;
		height: 100vh;
	}

	.release_content {
		margin-top: 30rpx;

		.release_tab {
			border-radius: 16rpx 16rpx 0 0;
			border-bottom: 1rpx solid #E4E4E4;
			background: #fff;
			align-items: center;
			justify-content: center;
			height: 86rpx;

			.tab_item {
				margin: 0 40rpx;
				font-size: 32rpx;
				color: #999;
				position: relative;
				line-height: 86rpx;
				cursor: pointer;

				&.on {
					color: #E93323;

					&::after {
						content: "";
						display: inline-block;
						width: 100%;
						height: 3rpx;
						background: #E93323;
						position: absolute;
						bottom: 2rpx;
						left: 0;
					}
				}

				.iconfont {
					margin-right: 10rpx;
					font-size: 32rpx;
				}
			}
		}

		padding: 0 20rpx;

		.release_item {
			background: #ffffff;
			padding: 0 30rpx;
			border-radius: 10rpx;

		}

		.photo_count {
			padding: 30rpx 0;
		}
	}

	/deep/.input_photo .easy-loadimage,
	/deep/.input_photo uni-image,
	/deep/.input_photo image {
		width: 180rpx;
		height: 180rpx;
		border-radius: 12rpx !important;
	}

	.input_photo .pictrue {
		width: 180rpx;
		height: 180rpx;
		border-radius: 12rpx !important;
		margin-right: 11rpx;
		position: relative;
		overflow: hidden;

		&:nth-child(3n) {
			margin-right: 0;
		}

		.close_btn {
			width: 30rpx;
			height: 30rpx;
			background: rgba(0, 0, 0, .6);
			border-radius: 0 12rpx 0 12rpx;
			position: absolute;
			top: 0;
			right: 0;
			display: flex;
			align-items: center;
			justify-content: center;
			z-index: 999;

			.iconfont {
				color: #ffffff;
				font-size: 12rpx;
			}
		}

		.cover_text {
			display: flex;
			width: 58rpx;
			height: 29rpx;
			background: #E93323;
			border-radius: 0px 12rpx 0px 12rpx;
			position: absolute;
			left: 0;
			bottom: 0;
			z-index: 10;
			align-items: center;
			justify-content: center;
			font-size: 18rpx;
			color: #fff;
		}
	}

	/deep/.loading-img {
		width: 180rpx;
		height: 180rpx;
		border-radius: 12rpx;
	}

	.input_photo .pictrue {
		margin-bottom: 20rpx;

		.videoHover {
			width: 180rpx;
			height: 180rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			position: absolute;
			top: 0;
			left: 0;
			z-index: 10;

			>view {
				width: 50rpx;
				height: 50rpx;
				background: #000000;
				border-radius: 50rpx;
				display: flex;
				align-items: center;
				justify-content: center;

				.iconfont {
					color: #ffffff;
					font-size: 21rpx;
				}
			}
		}

		.video-text {
			display: block;
			width: 180rpx;
			text-align: center;
			color: #ffffff;
			font-size: 18rpx;
			z-index: 13;
			position: absolute;
			bottom: 20rpx;
		}

		video {
			width: 180rpx;
			height: 180rpx;
			border-radius: 12rpx;
		}
	}

	.input_photo .add {
		background: #f6f6f6;
		color: #666666;

		.iconfont {
			font-size: 50rpx;
		}

		.text {
			margin-top: 20rpx;
			font-size: 27rpx;
		}
	}

	.textarea textarea {
		font-size: 28rpx;
		padding-bottom: 38rpx;
		width: 100%;
		box-sizing: border-box;
		height: 400rpx;
		overflow: hidden;
	}

	.textarea .placeholder {
		color: #BBBBBB;
	}

	.release_item .item {
		height: 106rpx;
		border-bottom: 1rpx solid #eee;
		position: relative;
		font-size: 30rpx;

		&:last-child {
			border-bottom: none;
		}

		.name {
			color: #333333;

			.iconfont {
				margin-right: 10rpx;
				font-size: 28rpx;
			}
		}

		.select {
			color: #bbbbbb;

			.select_count {
				display: flex;
				align-items: center;
			}

			.text {
				margin-right: 15rpx;
				display: flex;
				align-items: center;

				.image,
				image,
				uni-image {
					width: 60rpx;
					height: 60rpx;
					margin-right: 5rpx;
				}
			}

			.text1 {
				width: 308rpx;
				height: 70rpx;
				line-height: 70rpx;
				background: #FFFFFF;
				border-radius: 7px 7px 7px 7px;
				text-align: center;
				opacity: 1;
				border: 2rpx solid #999999;
				font-size: 28rpx;
				font-family: PingFang SC-Regular, PingFang SC;
				font-weight: 400;
				color: #CCCCCC;
			}

			.iconfont {
				font-size: 24rpx;
			}

			.text_name {
				color: var(--view-theme);
				padding: 5rpx 12rpx;
				background: var(--view-minorColor);
				border-radius: 23rpx;
				font-size: 24rpx;
				margin-right: 10rpx;

				.icon {
					color: var(--view-theme);
					font-weight: bold;
					font-size: 24rpx;
				}

				.title {
					margin: 0 10rpx;
				}

				.iconfont {
					font-size: 16rpx;
				}
			}
		}
	}

	.button {
		width: 710rpx;
		height: 86rpx;
		line-height: 86rpx;
		color: #ffffff;
		text-align: center;
		font-size: 32rpx;
		background: var(--view-theme);
		border-radius: 43rpx;
	}

	.release_btn {
		margin-top: 100rpx;
	}

	.video-count {
		position: fixed;
		width: 600rpx;
		height: 500rpx;
		top: 50%;
		left: 50%;
		margin-left: -300rpx;
		margin-top: -250rpx;
		z-index: 100;
		display: flex;
		align-items: center;
		justify-content: center;

		.videoLink {
			width: 600rpx;
			height: 500rpx;
		}
	}

	.popup_group {
		background: #fff;
		margin: 31rpx auto;
		width: 710rpx;
		font-size: 30rpx;
		border-radius: 10rpx;

		.popup_group_item {
			padding: 32rpx 30rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;

			.popup_group_item_value {
				display: flex;
				align-items: center;

				.popup_group_item_message {
					margin-right: 15rpx;
					color: #bbbbbb;
					max-width: 400rpx;

					&_value {
						display: inline-block;
						max-width: 400rpx;
						color: #000;
					}
				}

				.iconfont {
					color: #bbbbbb;
				}

				input {
					text-align: right;
				}
			}
		}

		>view:not(:last-child) {
			border-bottom: 1px solid #eeeeee;
		}
	}

	.radio {
		padding: 30rpx;

		&_label {
			padding-left: 10rpx;
			color: #333333;
			font-size: 30rpx;
			display: flex;
			align-items: center;

			.select_check {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 40rpx;
				height: 40rpx;
				border: 1px solid #cccccc;
				border-radius: 50%;
				margin-right: 20rpx;

				.iconfont {
					font-size: 24rpx;
				}
			}

			.select {
				background: #e93323;
				border: none;

				.iconfont {
					color: #fff;
				}
			}
		}

		.select_group {
			display: flex;
		}

		.flex_start {
			padding: 0 10rpx;
			margin-top: 40rpx;
			justify-content: flex-start;
		}

		&_select {
			display: flex;
			margin-right: 110rpx;
		}
	}
</style>