zoukankan      html  css  js  c++  java
  • uniapp视频图片上传

    <template>
    	<view class="release-page">
    			
    			<!-- #ifdef APP-PLUS -->
    				<uni-nav-bar fixed="true" left-icon="back" :status-bar="true" :border="false" title="发布" @clickLeft="back">
    				</uni-nav-bar>
    			<!-- #endif -->
    			<!-- #ifdef MP-WEIXIN -->
    				<uni-nav-bar fixed="true" :border="false">
    				</uni-nav-bar>
    				<view  style="height:80rpx;"></view>
    			<!-- #endif -->
    			
    			<view class="allBox">
    				
    				<!-- 输入内容 -->
    				<view class="textBox">
    					<textarea class="site fontSize" minlength="0" maxlength="100" @input="descInput" v-model="form.goods_text" placeholder="请输入内容"></textarea>
    					<text class="xianzhi">{{remnant}}/100</text>
    					<view class="video" @click="getVideo">
    						<image src="/static/image/video1.png"></image>
    					</view>
    					<view class="photo" @click="getImg">
    						<image src="/static/image/photo1.png"></image>
    					</view>
    					<text class="inputCss fontSize">
    						<text class="tipsX">*</text>
    						上传图片或视频(图片最多上传9张,视频最多上传1个)
    					</text>
    				</view>
    				<view class="upload">
    					<!-- <input class="inputCss fontSize" disabled placeholder="上传图片或时评(图片最多上传9张,视频最多上传1个)" type="text" /> -->
    				
    					<view class="imageBox flexWrap">
    						<view v-if="showList.length > 0" v-for="(item,index) in showList" :key="index" class="imgre">
    							<text @click="del(index)" class="del themeG">×</text>
    							<image v-if="item.type == 'img'" @click="lookPic(index,showList)" :src="item.img" mode="" class="selectImg"></image>
    							<image v-if="item.type =='video'" @click="payModeSelect(index)" :src="item.img+'?x-oss-process=video/snapshot,t_1000,f_jpg,w_800,h_600,ar_auto'"
    							 mode="" class="selectImg"></image>
    							 <u-icon v-if="item.type =='video'" @click="payModeSelect(index)" color="#fff" name="play-circle" size="60" class="play"></u-icon>
    						</view>
    						<!-- <image @click="getImg" v-if="fileList.length < 9" src="../../../static/image/save.png" mode="" class="selectImg"></image> -->
    					</view>
    				
    				</view>
    				<view class="formBox">
    					<!-- 商品分类 -->
    					<view class="classification">
    						<text class="tipsX">*</text>
    						<text class="fontSize">商品分类</text>
    						<view class="selectList">
    							<picker mode="multiSelector" class="cpicker" @change="changePicker" @columnchange="bindMultiPickerColumnChange" :value="multiIndex"
    							 :range="multiArray">
    								<input disabled type="text" v-model="form.memberType" class="listIpt" />
    							</picker>
    							<u-icon name="arrow-right"></u-icon>
    						</view>
    					</view>
    					<!-- 商品标题 -->
    					<view class="classification">
    						<text class="tipsX">*</text>
    						<text class="fontSize">商品标题</text>
    						<view class="selectList">
    							<input type="text" v-model="form.goods_name" class="listIpt" />
    							<!-- <u-icon name="arrow-right"></u-icon> -->
    						</view>
    					</view>
    					<!-- 商品原价 -->
    				<!-- 	<view class="classification" @click="getFocus(0)">
    						<text>商品原价</text>
    						<view class="selectList">
    							<text v-if="form.goods_marketprice">¥</text>
    							<input type="number" :focus="evaluateState" @blur="blurFocus(0)" maxlength="8" v-model="form.goods_marketprice" :style="{priceWidth+'upx'}" @input="priceInput" class="listIpt" />
    						
    						</view>
    					</view> -->
    					
    					<!-- 商品现价 -->
    					<view class="classification" @click="getFocus(1)">
    						<text class="tipsX">*</text>
    						<text class="fontSize">商品现价</text>
    						<view class="selectList">
    							<text v-if="form.goods_price">¥</text>
    							<input type="number" :focus="evaluateState1" @blur="blurFocus(1)" maxlength="8" v-model="form.goods_price" :style="{priceWidth2+'upx'}" @input="priceInput2" class="listIpt" />
    							<!-- <u-icon name="arrow-right"></u-icon> -->
    						</view>
    					</view>
    					
    					<!-- 库存 -->
    					<view class="classification" @click="getFocus(0)">
    						<text class="tipsX">*</text>
    						<text class="fontSize">商品库存</text>
    						<view class="selectList">
    							<input type="number" :focus="evaluateState" @blur="blurFocus(0)" maxlength="8" v-model="form.goods_storage" @input="priceInput" class="listIpt" />
    						</view>
    					</view>
    					<!--  配送方式 -->
    					<view class="classification">
    						<text class="tipsX">*</text>
    						<text class="fontSize">配送方式</text>
    						<view class="selectList">
    							<picker mode="selector" class="cpicker" @change="changePickerF" :value="listIndex" :range="listMode">
    								<text class="fontSizeSM">{{listMode[listIndex]}}</text>
    							</picker>
    							<u-icon name="arrow-right"></u-icon>
    						</view>
    					</view>
    					<!-- 商品运费 -->
    					<view class="classification" @click="getFocus(2)">
    						<text class="tipsX">*</text>
    						<text class="fontSize">商品运费</text>
    						<view class="selectList">
    							<text v-if="form.goods_freight || listIndex && default_shipping_fee">¥</text>
    							<input v-if="listIndex == 1" :value="default_shipping_fee" type="number" disabled style="100px;" class="listIpt" />
    							<input v-else type="number" :focus="evaluateState2" @blur="blurFocus(2)" maxlength="8" :style="{priceWidth3+'upx'}" @input="priceInput3" v-model="form.goods_freight" class="listIpt" />
    						</view>
    					</view>
    					<!-- 是否可以退款 -->
    				<!-- 	<view class="classification">
    						<text>能否退货</text>
    						<view class="selectList">
    							<picker mode="selector" class="cpicker" @change="isRefundChangePicker" :value="isRefund"
    							 :range="isRefundList">
    								<text>{{isRefundList[isRefund]}}</text>
    							</picker>
    							<u-icon name="arrow-right"></u-icon>
    						</view>
    					</view> -->
    					<!--   发货地址 -->
    					<view class="classification" @click="selectAddress">
    						<text class="tipsX">*</text>
    						<text class="fontSize">发货地址</text>
    						<view class="selectList">
    							<input type="text" disabled v-model="addressText" class="listIpt" />
    							<u-icon name="arrow-right"></u-icon>
    						</view>
    					</view>
    				</view>
    				<view class="relesePage" @click="uploadShop" :class="{'isClick':isClick}">
    					发布
    				</view>
    			</view>
    			
    			
    			
    			<!-- 弹框 -->
    			<uni-popup ref="payMode" type="center" :animation="true">
    				<view class="picBox">
    					<video :src="lookPicIndex" controls autoplay></video>
    				</view>
    			</uni-popup>
    			
    	</view>
    </template>
    
    <script>
    	import uniPopup from '@/component/uni-popup/uni-popup.vue';
    	import uniNavBar from '@/component/uni-nav-bar/uni-nav-bar.vue';
    	export default {
    		components: {
    			uniPopup,
    			uniNavBar
    		},
    		data() {
    			return {
    				showList: [],
    				fileList: [],
    				listMode:['快递','平台配送'],
    				listIndex:1,
    				isRefundList:['否','是'],
    				isRefund:0,
    				form: {
    					goods_name: '',
    					goods_price: '',
    					goods_freight_type:1,
    					goods_freight: '',
    					memberType: '',
    					goods_text: '',
    					goods_storage:''
    				},
    				place_of_delivery: '',
    				idsForm: {
    					gc_id_1: '',
    					gc_id_2: '',
    					gc_id_3: ''
    				},
    				addressText: '',
    				video: '',
    				image: '',
    				show: false,
    				// needFreight: null,
    				remnant: 0,
    				oneType: [],
    				twoType: [],
    				threeType: [],
    				oneTypeIndex: 0,
    				twoTypeIndex: 0,
    				multiArray: [],
    				multiIndex: [0, 0, 0],
    				oldIndex: [],
    				allClass: [],
    				isFreight: false,
    				lookPicIndex:'',
    				recordIndex: null,
    				priceWidth:60,
    				afterWidth:0,
    				priceWidth2:60,
    				afterWidth2:0,
    				priceWidth3:60,
    				afterWidth3:0,
    				evaluateState:false,
    				evaluateState1:false,
    				evaluateState2:false,
    				titleFocus:false,
    				imgList:[],
    				isClick:false,
    				default_shipping_fee:''
    			}
    		},
    		onLoad(e) {
    			let addressId = uni.getStorageSync("address");
    			if (addressId) {
    				let that = this;
    				that.place_of_delivery = addressId;
    				that.getAddressDetail(addressId);
    				uni.getStorage({
    					key:"allData",
    					success(res) {
    						let data = JSON.parse(res.data);
    						if(data.form.goods_price){
    							that.priceWidth2 = that.priceWidth2+(data.form.goods_price.length*20);
    						}
    						if(data.form.goods_freight){
    							that.priceWidth3 = that.priceWidth3+(data.form.goods_freight.length*20);
    						}
    						that.form = data.form;
    						that.fileList = data.fileList;
    						that.showList = data.showList;
    						that.idsForm = data.idsForm;
    						that.video = data.video;
    						that.listIndex = data.listIndex;
    					}
    				})
    				
    			}
    			
    		},
    		onShow() {
    			let that = this;
    			that.getAddressData();
    			that.getUserInfo();
    			that.getClass();
    			uni.getStorage({
    				key: 'address',
    				success(res) {
    					if (res.data) {
    						that.getAddressDetail(res.data);
    						that.place_of_delivery = res.data;
    					}
    				}
    			});
    		},
    		methods: {
    			
    			back(){
    				uni.switchTab({
    					url:'/pages/index/index'
    				})
    			},
    			getAddressData () {
    				let that = this;
    				that.$util.request({
    					url:'/mobile/index.php?act=member_address&op=address_list',
    					method:'get',
    					data:{}
    				}).then(res =>{
    					if(res.error_code == 0) {
    						for(var i = 0; i < res.datas.address_list.length ; i++){
    							if(res.datas.address_list[i].is_default == 1){
    								that.addressText = res.datas.address_list[i].area_info + ' ' + res.datas.address_list[i].address;
    								that.place_of_delivery = res.datas.address_list[i].address_id;
    							}
    						}
    					}
    				})
    			},
    			// 获取用户信息
    			getUserInfo() {
    				this.$util.request({
    					url: '/mobile/index.php?act=member_index&op=index',
    					method: 'post',
    					data: {}
    				}).then(res => {
    					if (res.error_code == 0) {
    						if (res.datas.member_is_store == 0) {
    							uni.showToast({
    								title: '您还不是卖家,请先申请入驻',
    								icon: 'none',
    								duration: 1000,
    								success() {
    									// 此处得改
    									setTimeout(() => {
    										uni.navigateTo({
    											url: '/pagesB/pages/sellerPresence/sellerPresence'
    										})
    									}, 1000)
    								}
    							})
    
    						}
    					}
    				})
    			},
    				// 图片预览
    			lookPic(current,urls){
    				let newArr = [];
    				for(var i = 0; i < urls.length; i++){
    					if(urls[i].type == 'img'){
    						newArr.push(urls[i].img);
    					}
    				}
    				urls = newArr;
    				uni.previewImage({
    					current:current,
    					urls:urls,
    					indicator:'number'
    				})
    			},
    			// 弹窗
    			payModeSelect(index) {
    				let that = this;
    				this.$refs.payMode.open()
    				this.lookPicIndex = this.showList[index].img;
    			},
    			closeWin() {
    				this.$refs.payMode.close()
    			},
    			getAddressDetail(id) {
    				let that = this;
    				that.$util.request({
    					url: '/mobile/index.php?act=member_address&op=address_info',
    					method: 'get',
    					data: {
    						address_id :id
    					}
    				}).then(res => {
    					that.addressText = res.datas.address_info.area_info + ' ' + res.datas.address_info.address;;
    				})
    			},
    			getImg() {
    				let that = this;
    				if (that.showList.length >= 9) {
    					uni.showToast({
    						title: '上传数量上限',
    						icon: 'none',
    						duration: 1000
    					})
    					return false;
    				}
    				uni.chooseImage({
    					count: 9,
    					sourceType: ['album', 'camera'],
    					success(res) {
    							
    						// let img = res.tempFilePaths;
    						// console.log(res.tempFilePaths)
    						// let img = res.tempFilePaths[0].join(",");
    						
    						let url = 'index.php?act=goods&op=authUploadImg';
    						// console.log(img);
    						let iNum = 9 - that.showList.length;
    						for(let i = 0; i < res.tempFilePaths.length; i++){
    							if(i == iNum){
    								return false
    							}
    							setTimeout(()=>{
    								that.uploadImg(res.tempFilePaths[i], 'img', '图片', url)
    							},i*200)
    						}
    						if(res.tempFilePaths.length > iNum){
    							uni.showToast({
    								title:'上传数量上限',
    								icon:'none'
    							})
    						}
    						// console.log(res.tempFilePaths[0].split(","))
    						// that.uploadImg(res.tempFilePaths[0], 'img', '图片', url)
    					}
    				})
    			},
    			// 获取视频
    			getVideo() {
    				let that = this;
    				if (that.showList.length >= 9) {
    					uni.showToast({
    						title: '上传数量上限',
    						icon: 'none',
    						duration: 1000
    					})
    					return
    				}
    				if (that.video) {
    					uni.showToast({
    						title: '视频只能上传1个',
    						icon: 'none',
    						duration: 1000
    					})
    					return
    				}
    				uni.chooseVideo({
    					count: 1,
    					sourceType: ['camera', 'album'],
    					success: function(res) {
    						let url = 'index.php?act=goods&op=upload_video';
    						let str = res.tempFilePath.substring(0,4);
    						// 拍摄
    						if(str != "file"){
    							let result = that.uploadPro(res.tempFilePath, '视频', url);
    							result.then(imgStr=>{
    								imgStr = JSON.parse(imgStr.data);
    								if (imgStr.error_code == 0) {
    									that.recordIndex = that.showList.length;
    									that.showList.push({
    										img: imgStr.datas.full_image_url,
    										type: 'video'
    									})
    									that.video = imgStr.datas.image_url;
    									uni.showToast({
    										title: imgStr.message,
    										icon: "none"
    									})
    								} else {
    									uni.showToast({
    										title: imgStr.message,
    										icon: "none"
    									})
    								}
    								uni.hideLoading();
    							});
    						}else{
    							that.uploadImg(res.tempFilePath, 'video', '视频', url)
    						}
    						
    					},
    					fail(e) {
    						console.log(e)
    					}
    				});
    			},
    			// 图片视屏删除
    			del(index) {
    				if (this.recordIndex == index) {
    					this.video = '';
    					this.showList.splice(index, 1);
    					this.recordIndex = null;
    				} else {
    					this.showList.splice(index, 1);
    					if(this.recordIndex != null && this.recordIndex < index){
    						this.fileList.splice(index-1, 1);
    					}else{
    						this.fileList.splice(index, 1);
    					}
    					if (this.recordIndex > index) {
    						this.recordIndex--;
    					}
    				}
    			},
    			// 返回上一页
    			onBackPress(e) {
    				if (e.from == "backbutton") {
    					uni.removeStorage({
    						key: 'allData'
    					})
    					uni.navigateBack({
    						delta: 1
    					})
    				}
    			},
    			// 发布
    			uploadShop() {
    				let that = this;
    				if(that.isClick){
    					return false;
    				}
    				that.image = '';
    				for (var i = 0; i < that.fileList.length; i++) {
    					if (that.fileList[i].type == 'img') {
    						that.image += that.fileList[i].img;
    						that.image += ','
    					}
    				}
    				that.image = that.image.substr(0, that.image.length - 1);
    				// if (this.listIndex == 1) {
    				// 	this.form.goods_freight = this.needFreight;
    				// }
    				if(that.image == "" && that.video == ""){
    					uni.showToast({
    						title:'必须上传一张图片或者视频',
    						icon:'none'
    					})
    					return false
    				}
    				if(that.idsForm.gc_id_1 == '' && that.idsForm.gc_id_2 == ''){
    					uni.showToast({
    						title:'请选择分类',
    						icon:'none'
    					})
    					return false
    				}
    				if(that.form["goods_storage"] < 1){
    					uni.showToast({
    						title:'库存不能小于1',
    						icon:'none'
    					})
    					return false
    				}
    				for (var i in that.form){
    					if(that.listIndex == 1){
    						if(that.form[i] == '' && i != "goods_freight"){
    							uni.showToast({
    								title:'请完善信息',
    								icon:'none'
    							})
    							return false
    						}
    					}else{
    						if(that.form[i] == ''){
    							uni.showToast({
    								title:'请完善信息',
    								icon:'none'
    							})
    							return false
    						}
    					}
    				}
    				let data = {
    					goods_text: that.form.goods_text,
    					gc_id_1: that.idsForm.gc_id_1,
    					gc_id_2: that.idsForm.gc_id_2,
    					goods_name: that.form.goods_name,
    					goods_price: that.form.goods_price,
    					goods_freight: that.form.goods_freight,
    					goods_freight_type:that.form.goods_freight_type,
    					place_of_delivery: that.place_of_delivery,
    					goods_video: that.video,
    					goods_image: that.image,
    					goods_storage:that.form.goods_storage
    				}
    				that.isClick = true;
    				that.$util.request({
    					url: '/mobile/index.php?act=goods&op=add_goods',
    					method: 'post',
    					data: data
    				}).then(res => {
    					if (res.error_code == 0) {
    						uni.showToast({
    							title: res.message,
    							icon: 'success',
    							duration: 1000,
    							success() {
    								setTimeout(()=>{
    									uni.navigateTo({
    										url: '/pagesA/pages/user/sell'
    									})
    									that.clearData();
    								},1000)
    							}
    						})
    						uni.removeStorage({
    							key: 'allData'
    						})
    						uni.removeStorage({
    							key: 'address'
    						})
    					} else {
    						uni.showToast({
    							title: res.message,
    							icon: 'none',
    							duration: 1000
    						})
    					}
    					setTimeout(()=>{
    						that.isClick = false;
    					},2000)
    				})
    			},
    			// 跳转到地址
    			selectAddress() {
    				let allData = {
    					form:this.form,
    					fileList:this.fileList,
    					showList:this.showList,
    					idsForm:this.idsForm,
    					video:this.video,
    					listIndex:this.listIndex
    				}
    				uni.setStorage({
    					key: 'allData',
    					data: JSON.stringify(allData)
    				})
    				uni.navigateTo({
    					url: '/pages/address/address?type=releaseA'
    				})
    			},
    			descInput() {
    				var txtVal = this.form.goods_text.length;
    				this.remnant = txtVal;
    			},
    			popup(index) {
    				this.form.freeItem = this.list[index].text;
    			},
    			// 获取分类
    			getClass() {
    				this.multiArray = [];
    				this.oneType = [];
    				this.twoType = [];
    				this.$util.request({
    					url: '/mobile/index.php?act=goods_class&op=getAllClass',
    					method: 'get',
    					data: {}
    				}).then(res => {
    					this.allClass = res.datas.goods_class;
    					this.default_shipping_fee = res.datas.default_shipping_fee;
    					this.renderPicker(true);
    				})
    			},
    			// 联动处理	
    			renderPicker(isT, arr) {
    				let num = 1;
    				let num1 = 1;
    				if (isT) {
    					this.oneType = [];
    				}
    				for (var i = 0; i < this.allClass.length; i++) {
    					if (isT) {
    						this.oneType.push(this.allClass[i].gc_name);
    						this.twoType = [];
    					} else {
    						if (this.oneType[arr[0]] == this.allClass[i].gc_name) {
    							this.idsForm.gc_id_1 = this.allClass[i].gc_id;
    							this.oldIndex[0] = this.allClass[i].gc_id;
    						}
    					}
    					if (this.allClass[this.oneTypeIndex].class2.length != 0) {
    						for (var j = 0; j < this.allClass[this.oneTypeIndex].class2.length; j++) {
    							if (isT) {
    								this.twoType.push(this.allClass[this.oneTypeIndex].class2[j].gc_name);
    								this.threeType = [];
    							} else {
    								if (this.twoType[arr[1]] == this.allClass[this.oneTypeIndex].class2[j].gc_name) {
    									if (num == 1) {
    										this.idsForm.gc_id_2 = this.allClass[this.oneTypeIndex].class2[j].gc_id;
    										this.oldIndex[1] = this.allClass[this.oneTypeIndex].class2[j].gc_id;
    										num++;
    									}
    								}
    							}
    							// if (this.allClass[this.oneTypeIndex].class2[this.twoTypeIndex].class3.length != 0) {
    							// 	for (var l = 0; l < this.allClass[this.oneTypeIndex].class2[this.twoTypeIndex].class3.length; l++) {
    							// 		if (isT) {
    							// 			this.threeType.push(this.allClass[this.oneTypeIndex].class2[this.twoTypeIndex].class3[l].gc_name);
    							// 		} else {
    							// 			if (this.threeType[arr[2]] == this.allClass[this.oneTypeIndex].class2[this.twoTypeIndex].class3[l].gc_name) {
    							// 				if (num1 == 1) {
    							// 					this.idsForm.gc_id_3 = this.allClass[this.oneTypeIndex].class2[this.twoTypeIndex].class3[l].gc_id;
    							// 					this.oldIndex[2] = this.allClass[this.oneTypeIndex].class2[this.twoTypeIndex].class3[l].gc_id;
    							// 					num1++;
    							// 				}
    							// 			}
    							// 		}
    							// 	}
    							// }
    						}
    					}
    				}
    				// console.log(this.oneType)
    				if (isT) {
    					if (this.oneType.length != 0) {
    						this.multiArray.push(this.oneType);
    					}
    					if (this.twoType.length != 0) {
    						this.multiArray.push(this.twoType);
    					}
    					// if (this.threeType.length != 0) {
    					// 	this.multiArray.push(this.threeType);
    					// }
    				}
    			},
    			bindMultiPickerColumnChange: function(e) {
    				this.multiArray = [];
    				if (e.detail.column == 0) {
    					this.oneTypeIndex = e.detail.value;
    					this.twoTypeIndex = 0;
    				} else if (e.detail.column == 1) {
    					this.twoTypeIndex = e.detail.value;
    				}
    				this.multiIndex[e.detail.column] = e.detail.value;
    				this.renderPicker(true);
    				this.$forceUpdate();
    			},
    			// 确定时改变
    			changePicker(e) {
    				// if (e.detail.value.length == 3 && this.threeType[e.detail.value[2]] != undefined) {
    				// 	this.form.memberType = this.multiArray[0][this.multiIndex[0]] + ',' + this.multiArray[1][this.multiIndex[1]] + ',' +
    				// 		this.multiArray[2][this.multiIndex[2]];
    				// } else {
    					this.form.memberType = this.multiArray[0][this.multiIndex[0]] + ',' + this.multiArray[1][this.multiIndex[1]];
    				// }
    				this.renderPicker(false, e.detail.value);
    			},
    			changePickerF(e) {
    				this.listIndex = e.detail.value;
    				if (e.detail.value == 0) {
    					// this.isFreight = false;
    					// this.form.goods_freight = 0;
    					this.form.goods_freight_type = 2;
    				}else if(e.detail.value == 1){
    					// this.isFreight = true;
    					this.form.goods_freight_type = 1;
    					this.form.goods_freight = '';
    				}
    				// else {
    					// this.isFreight = false;
    					// this.form.goods_freight = -1;
    				// }
    			},
    			// isRefundChangePicker(e){
    			// 	this.isRefund = e.detail.value;
    			// 	this.form.goods_refund_type = e.detail.value;
    			// },
    			uploadPro(tempFilePaths, text ,url) {
    				uni.showLoading({
    					title:text+'上传中'
    				})
    				let that = this;
    				let data = that.$utilImg.request(url);
    				return new Promise(res => {
    					uni.uploadFile({
    						// 需要上传的地址
    						url: 'http://xbbang.aitecc.com/mobile/' + url,
    						// filePath  需要上传的文件
    						filePath: tempFilePaths,
    						name: 'file',
    						formData: {
    							key: data.key,
    							api_sign: data.api_sign,
    							comefrom: data.comefrom,
    							api_time: data.api_time,
    							api_member_id: data.api_member_id,
    							api_member_name: data.api_member_name,
    						},
    						success(res1) {
    							res(res1);
    						}
    					})
    				})
    			},
    			// 图片视屏上传
    			async uploadImg(tempFilePaths, type, text, url) {
    				let that = this;
    				let imgStr = await that.uploadPro(tempFilePaths,text,url);
    				imgStr = JSON.parse(imgStr.data);
    				if (imgStr.error_code == 0) {
    					if (type == 'img') {
    						console.log(imgStr)
    						that.showList.push({
    							img: imgStr.datas.full_image_url,
    							type: 'img'
    						})
    						that.fileList.push({
    							img: imgStr.datas.image_url,
    							type: 'img'
    						});
    					} else {
    						that.recordIndex = that.showList.length;
    						that.showList.push({
    							img: imgStr.datas.full_image_url,
    							type: 'video'
    						})
    						that.video = imgStr.datas.image_url;
    					}
    					uni.showToast({
    						title: imgStr.message,
    						icon: "none"
    					})
    				} else {
    					uni.showToast({
    						title: imgStr.message,
    						icon: "none"
    					})
    				}
    				uni.hideLoading()
    				// uni.showToast({
    				// 	title: text + "上传中",
    				// 	icon: "none",
    				// 	duration:1000,
    				// 	success: (result) => {
    						
    				// 	}
    				// })
    			},
    			// 长度计算
    			priceInput(e){
    				if(this.afterWidth < e.detail.value.length){
    					this.priceWidth += 20;
    				}else if(this.afterWidth != e.detail.value.length){
    					if(this.priceWidth>40){
    						this.priceWidth -= 20;
    					}
    				}
    				this.afterWidth = e.detail.value.length;
    			},
    			
    			// 长度计算
    			priceInput2(e){
    				if(this.afterWidth2 < e.detail.value.length){
    					this.priceWidth2 += 20;
    				}else if(this.afterWidth2 != e.detail.value.length){
    					if(this.priceWidth2>40){
    						this.priceWidth2 -= 20;
    					}
    				}
    				this.afterWidth2 = e.detail.value.length;
    			},
    			
    			// 长度计算
    			priceInput3(e){
    				if(this.afterWidth3 < e.detail.value.length){
    					this.priceWidth3 += 20;
    				}else if(this.afterWidth3 != e.detail.value.length){
    					if(this.priceWidth3>40){
    						this.priceWidth3 -= 20;
    					}
    				}
    				this.afterWidth3 = e.detail.value.length;
    			},
    			getFocus(type){
    				if(type == 0){
    					this.evaluateState = !this.evaluateState;
    				}else if (type == 1){
    					this.evaluateState1 = !this.evaluateState1;
    				}else{
    					this.evaluateState2 = !this.evaluateState2;
    				}
    			},
    			blurFocus(type){
    				if(type == 0){
    					this.evaluateState = !this.evaluateState;
    				}else if (type == 1){
    					this.evaluateState1 = !this.evaluateState1;
    				}else{
    					this.evaluateState2 = !this.evaluateState2;
    				}
    			},
    			clearData(){
    				this.showList = [],
    				this.fileList = [],
    				this.listMode = ['快递','平台配送'],
    				this.listIndex = 1,
    				this.isRefundList =['否','是'],
    				this.isRefund =0,
    				this.form = {
    					goods_name: '',
    					goods_price: '',
    					goods_freight: '',
    					goods_freight_type:1,
    					memberType: '',
    					goods_text: '',
    					goods_storage:'',
    				},
    				this.place_of_delivery = '',
    				this.idsForm = {
    					gc_id_1: '',
    					gc_id_2: '',
    					gc_id_3: ''
    				},
    				this.addressText = '',
    				this.video = '',
    				this.image = '',
    				this.show = false,
    				this.needFreight = null,
    				this.remnant =  0,
    				this.oneType =  [],
    				this.twoType =  [],
    				this.threeType =  [],
    				this.oneTypeIndex =  0,
    				this.twoTypeIndex =  0,
    				this.multiArray =  [],
    				this.multiIndex =  [0, 0, 0],
    				this.oldIndex =  [],
    				this.allClass =  [],
    				this.isFreight =  false,
    				this.lookPicIndex = '',
    				this.lookPicType =  '',
    				this.recordIndex =  null,
    				this.priceWidth = 60,
    				this.afterWidth = 0,
    				this.priceWidth2 = 60,
    				this.afterWidth2 = 0,
    				this.priceWidth3 = 60,
    				this.afterWidth3 = 0,
    				this.evaluateState = false,
    				this.evaluateState1 = false,
    				this.evaluateState2 = false,
    				this.titleFocus = false,
    				this.imgList = []
    			}
    		}
    	}
    </script>
    
    <style scoped lang="scss">
    	.imagePic {
    		 130rpx !important;
    		height: 130rpx !important;
    	}
    	.fontSize {
    		font-size: 35rpx !important;
    		font-weight: 400 !important;
    	}
    	.fontSizeSM {
    		font-size: 30rpx !important;
    		font-weight: 400 !important;
    	}
    	.release-page {
    		.allBox{
    			padding: 20upx;
    			box-sizing: border-box;
    			
    			
    			.textBox {
    				 100%;
    				position: relative;
    				// background-color: #F7F7F7;
    				// height: 520rpx;
    				.site {
    					 100%;
    					height: 430upx;
    					background: rgba(247, 247, 247, 1);
    					border-radius: 8upx;
    					// padding-left: 30upx;
    					padding:20upx;
    					// padding-top: 30upx;
    					box-sizing: border-box;
    				}
    			
    				.xianzhi {
    					position: absolute;
    					right: 36upx;
    					bottom: 108upx;
    				}
    			
    				.site::-webkit-input-placeholder {
    					color: #ddd;
    				}
    			
    				.video,
    				.photo {
    					position: absolute;
    					left: 30upx;
    					bottom: 120upx;
    					 154upx;
    					height: 154upx;
    					display: flex;
    					justify-content: center;
    					align-items: center;
    					background-color: #fff;
    					cursor: pointer;
    			
    					image {
    						 40upx;
    						height: 34upx;
    						color: rgba(251, 133, 57, 1);
    					}
    			
    					.imageStyle {
    						 154upx;
    						height: 154upx;
    					}
    				}
    			
    				.photo {
    					left: 225upx;
    				}
    			}
    			
    			.upload {
    				margin-top: 46upx;
    			
    				.selectImg {
    					 224rpx;
    					height: 224rpx;
    					border-radius: 20rpx;
    				}
    			
    				.imageBox {
    					.imgre {
    						position: relative;
    						margin-right: 14rpx;
    			
    						&:nth-child(3n) {
    							margin-right: 0;
    						}
    						.play{
    							position: absolute;
    							left: 50%;
    							top: 50%;
    							transform: translate(-50%,-50%);
    						}
    						.del {
    							position: absolute;
    							color: #fff;
    							right: 10rpx;
    							top: 10rpx;
    							 40rpx;
    							height: 40rpx;
    							border-radius: 50%;
    							text-align: center;
    							z-index: 99;
    						}
    					}
    				}
    			}
    			
    			.formBox {
    				margin-top: 20upx;
    			
    				.classification {
    					height: 70upx;
    					display: flex;
    					align-items: center;
    					justify-content: space-between;
    					border-bottom: 1px solid #f5f5f5;
    					margin-bottom: 20upx;
    					text {
    						font-size: 24upx;
    						font-family: PingFang SC;
    						font-weight: 500;
    						color: rgba(92, 92, 92, 1);
    					}
    			
    					.selectList {
    						display: flex;
    						align-items: center;
    						flex: 1;
    						display: flex;
    						justify-content: flex-end;
    						.cpicker{
    							 100%;
    							text-align: right;
    						}
    						.listIpt {
    							// border: 1px solid #333;
    							box-sizing: border-box;
    							padding-left: 20upx;
    							padding-right: 20upx;
    							 100%;
    							font-size: 30upx;
    							text-align: right;
    							font-family: PingFang SC;
    							font-weight: 500;
    							color: rgba(92, 92, 92, 1);
    						}
    					}
    				}
    			}
    			
    			.relesePage {
    				height: 78upx;
    				background: rgba(251, 133, 57, 1);
    				border-radius: 8upx;
    				font-size: 30upx;
    				font-family: PingFang SC;
    				font-weight: 500;
    				color: rgba(255, 255, 255, 1);
    				line-height: 78upx;
    				text-align: center;
    				margin-top: 61upx;
    			}
    			
    			.isClick{
    				background-color: #ccc;
    			}
    			.showCreator {
    				background: rgba(255, 255, 255, 1);
    				border-radius: 30upx;
    			
    				.ht {
    					height: 115upx;
    					border-bottom: 1px solid #f5f5f5;
    					line-height: 115upx;
    					text-align: center;
    					color: #333;
    				}
    			}
    		}
    		
    	}
    
    	.inputCss {
    		color: #999999;
    		margin-bottom: 20upx;
    		display: flex;
    		font-size: 30upx;
    		flex-wrap: nowrap;
    	}
    </style>
    

      

  • 相关阅读:
    MySQL与PostgreSQL对比
    Elastic Job3.0
    Nacos Config动态刷新值
    clickhouse数据类型
    字符串和整数之间的转换
    STL之优先队列 priority_queue
    c++智能指针
    springcloud gateway: discovery: locator: enabled: true 解释
    工具资源下载链接 webstorm
    技术链接汇总
  • 原文地址:https://www.cnblogs.com/daifuchao/p/13509577.html
Copyright © 2011-2022 走看看