SOURCE

console 命令行工具 X clear

                    
>
console
<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.3, minimum-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title></title>
	<link rel="stylesheet" href="./css/index.css">
	<link rel="stylesheet" href="https://unpkg.com/mint-ui/lib/style.css">
</head>
<style>
.mint-header{
	background: #3FD15B;
}
.mint-header{width: 100%; position: fixed; opacity: 1; z-index: 100;}
#add{width: 100%;background: #e1e1e1;}
body{padding: 0px!important;margin: 0px!important;}
.header {font-size: 16px!important;text-align: center!important;padding: 0px!important;margin: auto!important;}
.listeach{
	position: relative;
	box-sizing: border-box;
	width: 98%;
	margin:14px auto;
	overflow: hidden;
	clear: both;
	border-bottom: 1px solid #e1e1e1;
	background: white;
	padding: 0px 4px 8px 4px;
}
.inputll .datainput{
	display: inline-block; 
	height: 25px;
	line-height: 25px; 
	float: right;
	width: 54%;
	border-radius: 4px;
	border: 1px solid #E1E1E1!important;
	text-indent: 3px;
	font-size: 12px;
}
.buildmore{
	width: 96%;
	margin:5px auto;
	text-align: center;
	border-radius: 4px;border: 1px solid #E1E1E1!important;
	overflow: hidden;
	clear: both;
	height: 30px;
	line-height: 30px;
	font-size: 14px;
}
.listeach .listtop{font-size: 1rem;width: 100%;display: block;overflow: hidden;clear: both;}
.listeach .listtop .topl,.listeach .listtop .topr{font-size: 14px;}
.listeach .listtop .topl{float: left;}
.listeach .listtop .topr{float: right;}
.listeach p{font-size: 14px;padding: 0px;margin: auto;padding: 8px 0px;font-weight: bold;}
.listend{font-size: 14px;width: 100%;text-align: right;}
.listall{/*margin-top: 10px; */             padding-top:40px ;}
.goodstitle{overflow: hidden; width: 96%;margin:auto auto auto auto;padding: 5px 0px;}
.goodstitle span{font-size: 14px;font-weight: bold;}
.goodstitle span:nth-child(1){float: right;font-weight: bold;}
.goodstitle span:nth-child(2){float: left;}
input{border-radius: 4px;border: 1px solid #E1E1E1;font-size: 14px;text-indent: 4px;outline: none;}
.inputlist{overflow: hidden;}
.inputlist div{margin: 0px 0px;overflow: hidden;}		
.inputrr,.inputll{width: 50%;float: left;}
.inputll span{font-size: 14px;display: inline-block; height: 25px;line-height: 25px; float: left;width: 44%;}
.inputrr span{font-size: 14px;display: inline-block; height: 25px;line-height: 25px; float: left;width: 30%; text-align: center;}
.inputrr input{display: inline-block; height: 25px;line-height: 25px; float: left;width:30%; text-align: center;}
.inputeach{clear: both;overflow: hidden;}
.inputeach input{display: inline-block; height: 25px;line-height: 25px; float: left;width: 73%;}
.inputother span, .inputother input{font-size: 14px;float: left;width: 24%;display: inline-block;height: 25px;line-height: 25px;}
.inputother span{text-align: center;}
.buildmorediv{width: 100%;margin:10px auto;text-align: center;overflow: hidden;clear: both;}
.goods_list{overflow: hidden;clear: both;}
.cleabboth{
	height: 7px; 
	width: 100%;
	overflow: hidden; 
	clear: both; 
	margin: 8px auto 8px auto;
	moz-box-shadow:2px 2px 5px #e1e1e1; 
	-webkit-box-shadow:2px 2px 5px #e1e1e1; 
	box-shadow:2px 2px 5px #e1e1e1;
	border: none;
	background:#e1e1e1;
}
.inputtop{width: 98%;margin:3px auto!important;}
.delmore{text-align: right;margin-right: 18px!important;font-size: 20px;color: red;}
.upform{height: 65px;margin: 8px auto; overflow: hidden;clear: both; width: 100%;border-bottom: 1px solid #E1E1E1;}
.upform div{
	margin-top: 10px;
	width: 60px;
	height: 50px;
}
.upform .formleft{
	float: left;
	text-align: center;
	line-height: 40px;
	font-size: 14px;
	font-weight: bold;
	margin-left: 2%;
}
.upform .formright{
	float: right;
	width: 120px!important;
	margin-right: 2%;
}
.upform .formright input{
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    font-size: 23px;
    cursor: pointer;
   opacity: 0;
}
.chanceimg{
	display: block;
	height: 40px;
	width: 40px;
	float: right;
}
.chance{
	padding: 0px 8px;
	float: left;
	background: #3498db;
	color: white;
	position: relative;
    display: inline-block;
    margin-bottom: 0;
    font-size: 12px;
    font-weight: 400;
    line-height: 36px;
    height: 36px;
    text-align: center;
    border: 1px solid transparent;
    border-radius: 4px;
	}
	.activenone{
		background: #E1E1E1;
	}
	.class-b{
		display: none!important;
	}
	.noinput{
		background: #E8E8E1!important;
	}
	@media screen and (min-width: 800px) { 
		#app {width: 540px!important;margin: auto;}
		.mint-header{width: 540px!important;} 
	}  
	</style>
	<body>
		<div id="app">
			<div class="contain">
				<mt-header title="入库接收详情">
  					<router-link to="" slot="left">
    					<mt-button icon="back"  @click="goback">返回</mt-button>
  					</router-link>
  					<mt-button slot="right" @click="getsure">提交审核</mt-button>
				</mt-header>
				<div class="listall">
					<div class="listeach">
						<div class="listtop">
							<span class="topl" v-if="Receiveall.arrayTime == 0">今天</span>
							<span class="topl" v-if="Receiveall.arrayTime == 1">明天</span>
							<span class="topl" v-if="Receiveall.arrayTime == 2">后天</span>
							<span class="topr" v-if="Receiveall.reveceState == 0" style="color: #3FD15B;">待接收 </span>
							<span class="topr" v-if="Receiveall.reveceState == 1" style="color: #3FD15B;">审核中</span>
							<span class="topr" v-if="Receiveall.reveceState == 2" style="color: #3FD15B;">审核拒绝</span>
							<span class="topr" v-if="Receiveall.reveceState == 3" style="color: #3FD15B;">审核通过</span>
						</div>
						<p>{{Receiveall.receiveNo}}</p>
						<div class="listend">
							总计:<span style="font-weight: bold;">{{Receiveall.productCount}}</span>种商品,共
							<span style="font-weight: bold;">{{Receiveall.seCount}}</span>件
						</div>
					</div>
				</div>
				<div class="upform">
					<div class="formleft">送货单</div>
					<div class="formright">
						<img class="chanceimg" :src="this.imgurl" alt="" id="portrait"/>
						<span class="chance" >选择图片<input type="file" id="saveImage" name="myphoto" @change="getFile"></span>
					</div>
				</div>
				<div class="goodsall">
					<div class="goods_list" v-for="(item, pIdx) in datalist">
						<div v-if="item.style !== 1" class="cleabboth"></div>
						<div class="Rejectionstyle" style="margin: 2px 10px;">
							<mt-switch v-model="item.setflag"  @change="turnstyle(item, pIdx)">拒收</mt-switch>
						</div>
						<div class="goodstitle">
							<span>{{item.barCode}}</span>
							<span>{{item.goodName}}</span>
						</div>
						
						<div class="inputlist" v-for="(each, index) in item.prppList">
							<div class="delmore" @click="deleteone(pIdx, index)">✕</div>
							<div class="inputtop" style="display: block;overflow: hidden;clear: both;">
								<div  class="inputll">
									<span>生产日期:</span>
									<span class="datainput" @click="dateClick1(each, pIdx)" :class="{'noinput': nonebg}">{{each.batch}}</span>
								</div>
								<div  class="inputrr">
									<span>的商品</span>
									<input v-model="each.realBuyCount" :disabled="nonebg" type="number"  @blur="sumFocus($event)"/>
									<span style="text-align:center;">件</span>
								</div>
							</div>
							<div class="buildmorediv" v-if="index== 0" :class="{'class-b': nonebg}"><p class="buildmore" @click="buildmore(item, pIdx)">新增一条</p></div>
						</div>
					</div>
				</div>
  				
				<mt-datetime-picker 
					v-model="dataVal1" 
					type="date" 
					ref="picker1" 
					year-format="{value}年" 
					month-format="{value}月" 
					date-format="{value}日" 
				 	hour-format="{value}"
                	minute-format="{value}"
                	second-format="{value}"
					@confirm="handleConfirm1"
				>
				</mt-datetime-picker>
				<mt-datetime-picker 
					v-model="dataVal1" 
					type="date" 
					ref="picker2" 
					year-format="{value}年" 
					month-format="{value}月" 
					date-format="{value}日" 
				 	hour-format="{value}"
                	minute-format="{value}"
                	second-format="{value}"
					@confirm="handleConfirm2"
				>
				</mt-datetime-picker>
  				
			</div>
		</div>
		<script src="https://unpkg.com/vue/dist/vue.min.js"></script>
		<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
		<script src="https://unpkg.com/mint-ui/lib/index.js"></script>
		<script src="https://unpkg.com/vue-resource@1.5.1/dist/vue-resource.js"></script>
		<script>
			var app = new Vue({
				el: '#app',
				data: {
					//LINK:'http://ha.tongchengxianggou.com',
					LINK:"http://pic.tongchengxianggou.com:9011",
					//LINK:"http://192.168.124.66:8888/web",
					noneid:'',
					addpart:[
						{name: "待审核"}, 
					],
					loopmark:'',
					whether:'',
					maina:'',
					newmian:[],
					imgurl:"http://www.17sucai.com/preview/1/2016-12-16/take_photo/img/photo_icon.png",
					nonebg: false,
					objbighight:'',
					localtime:'',
					localaccept:'',
					localcount:'',
					localsingle:'',
					targetID:'',
					statetypeid:'',
					hotmain:{},
					srcimg:'',
					personalPhoto:true,
					localid:'',
					cont:{},
					conttime:{},
					time:'',
					danwei:'',
					datalist:[],
					dataall:[],
					value: null,
					pickerValue:null,
					pickerValue:'',
					build:'',
					current: 0,
					showOrFalse: false,
					mobile: null,
					active: 0,
					dataVal1: new Date(),
					date1: "", //默认值
					date2: "", //默认值
			        navArr: [
						{name: "待审核"},                 
						{name: "审核中"},                 
						{name: "已完成"}            
					],
					setdata:[],
					imglink:'',
					imgname:'',
					imgarray:[],
					Receiveall:{}
				},
				methods:{
					turnstyle: function(ta,tb){
						console.log(ta.setflag)
						console.log(tb)
				  	},
				  	sumFocus(e){
						if(e.target.value<=0){
							e.target.value =""
							return false
						}else{
							e.target.value =e.target.value
						}
					},
					getFile(){
						var x = document.getElementById('saveImage').files[0];
		                var  param = new FormData();     // 创建form对象
		               	param.append('imgFileTmp',x)    //对应后台接收图片名
		                this.$http.post(this.LINK+`/app/sku/sku-instorage-accept/upload-tmp-pic-dothing/do`,param)
	                    .then(res => {
							if(res.data.code === 200){
								this.$toast({
							  		message: res.data.msg,
							  		position: 'center',
							  		duration: 2000
								});
								var datasmall = JSON.parse(res.data.data)
								this.imgarray = datasmall;
								this.imglink = datasmall[0].url;
								this.imgname = datasmall[0].name;
							}else{
								this.$toast({
							  		message: res.data.msg,
							  		position: 'center',
							  		duration: 2000
								});
							}
						})
	                    .catch(function(error){
	                        console.log(error);
	                    });
						
					},
					goback(){
						window.history.go(-1);
					},
				 	great(){
	      				document.getElementById('saveImage').onchange = function () {
	          				var imgFile = this.files[0];
	      					var fr = new FileReader();
	          				fr.onload = function () {
	          					this.imgurl = fr.result;
	            				document.getElementById('portrait').src = this.imgurl;
	          				};
	          				fr.readAsDataURL(imgFile);
	          			}
        			},
        			databuild(a) {
        				var formData = new FormData()
						this.Receiveall= JSON.parse(localStorage.getItem("ReceiveData"));
        				console.log(this.Receiveall)
        				this.$indicator.open({
					      	text: '加载中....',
					      	spinnerType: 'fading-circle'
					  	});
					 	var _this = this;
						this.load_data = false;
						this.$http({
							method: 'POST',
							url: this.LINK +`/sku/revece/order/list/product`+"?receveId="+this.Receiveall.id+"&max="+10000,
							headers: {
								'Content-Type': 'application/x-www-form-urlencoded'
							},
						}).then(res => {
							if(res.data.code ===200){
								this.$indicator.close();
								var that = this;
								console.log("shuju")
								console.log(res.data.data)
								//this.datalist = res.data.data.rvList;
		                  		var loopadd=[];
		                  		var changedata=[];
		                  		var looparry=[];
		                  		res.data.data.rvList.map((item) =>{
	                  				if(item.flag===0){
	                  					this.$set(item, 'setflag', false)
	                  				}else if(item.flag===1){
	                  					this.$set(item, 'setflag', true)
	                  				}
		          				})
						
								this.datalist = res.data.data.rvList;
								
							}
						})
					},
					//循环出来的删除
					deleteone(a,b){
						console.log(a)
						this.$messagebox({
							title: '温馨提示',
							message: '确定需要删除吗?',
							showCancelButton: true,
							confirmButtonText:"删除",
							cancelButtonText:"取消"
				        }).then(action => {
							if(action == 'confirm'){
								this.datalist[a].prppList.splice(b,1);
							}
			     	 	})
					},
			        delneed(target,few){
			        	this.$messagebox({
			          		title: '温馨提示',
				          	message: '确定需要删除吗?',
				          	showCancelButton: true,
				          	confirmButtonText:"删除",
				          	cancelButtonText:"取消"
				        }).then(action => {
				          	if(action == 'confirm'){
				            	this.datalist.splice(few,1);
				          	}else{
					          }
			     	 	})
					},
					//-----------------------------时间选择----------------------------------------------------
					dateClick1(a,b) {
						console.log(a)
						this.$refs.picker1.open();
            			this.cont = a
            		},
            		handleConfirm1(value) {
            			//alert(value)
                		var d = new Date(value);
        				if (d.getMonth() >= 0) {
		          			var month = (d.getMonth() + 1) < 10 ? ('0' + (d.getMonth() + 1)) : (d.getMonth() + 1)
			          		var day = (d.getDate()) < 10 ? ('0' + (d.getDate())) : (d.getDate())
							var hh = (d.getHours()) < 10 ? ('0' + (d.getHours())) : (d.getHours())
			          		var times = d.getFullYear() + '-' + month + '-' + day;
			          		this.date1 = times//注意pickerVisibles带s
				        }else{
				          	this.date1 = "1807-01-01"//设置的开始日期
				        }
				 		this.cont.batch  = this.date1 
		           	},
		           	
		           	dateClick2(c,b) {
						this.$refs.picker2.open();
            			this.conttime = c;
            		},
            		handleConfirm2(value) {
                		var d = new Date(value);
        				if (d.getMonth() >= 0) {
		          			var month = (d.getMonth() + 1) < 10 ? ('0' + (d.getMonth() + 1)) : (d.getMonth() + 1)
			          		var day = (d.getDate()) < 10 ? ('0' + (d.getDate())) : (d.getDate())
							var hh = (d.getHours()) < 10 ? ('0' + (d.getHours())) : (d.getHours())
			          		var timeall = d.getFullYear() + '-' + month + '-' + day+" "+"00"+":"+"00"+':'+"00" ;;
			          		this.date2 = timeall//注意pickerVisibles带s
				        }else{
				          	this.date2 = "1807-01-01"//设置的开始日期
				        }
				 		this.conttime.attrValue  = this.date2; 
		           	},
		           	
			        buildmore(a,b){
			        	this.maina = a;
						console.log("aaaaaaaaaaaaaaaaaa")
						console.log(a)
						addmore: [],
						newobj = {
							batch: "",
							realBuyCount: "",
						}
						this.newmian.push(newobj)
						a.prppList.splice(b + 1, 0, newobj)
						this.hotmain = newobj;
						console.log(this.datalist)
                  	},
                  	getsure() {
                  		var x = document.getElementById('saveImage').files[0];
                  		if(x){
                  			this.$indicator.open({
						      	text: '加载中....',
						      	spinnerType: 'fading-circle'
						  	});
                  			console.log(this.datalist)
	                  		var loopadd=[];
	                  		var looparry=[];
	                  		this.datalist.map((item) =>{
	                  			if(item.setflag===false){
	              					this.$set(item, 'flagto', 0)
	              				}else if(item.setflag===true){
	              					this.$set(item, 'flagto', 1)
	              				}
	                  			var dange =({
	              					"prrId": item.id,
	              					"flag":item.flagto,
	              					"li":[]
	              					
	              				})
	                  			loopadd.push(dange)
	                  			loopmain = item.prppList;
	              				loopmain.map((item)=>{
	                  				var loopobj =({
	                  					"batchNo": item.batch,
	                  					"buyCount":item.realBuyCount,
	                  				})
	                  				dange.li.push(loopobj)
	                  				
	                  			})
	          				})
	                  		console.log("惺惺惜惺惺想")
	                  		console.log(loopadd)
	                  		let param = new FormData();
	              			param.append('receveId',this.Receiveall.id)//商品模板id
	              			param.append('state', 2)//富文本
	              			param.append('url', this.imglink)//富文本
	              			param.append('name', this.imgname)//富文本
		        			param.append('jsonArray', JSON.stringify(loopadd))//模板json
		        			this.$http.post(this.LINK+`/sku/purchas/requisition/product/price/add`,param)
	                			.then(res =>  {
								if(res.data.code === 200){
									this.$toast({
							  			message: res.data.msg,
							  			position: 'center',
							  			duration: 2000
							  		});
							  		this.$indicator.close();
							  		setTimeout(function(){
					                    window.history.go(-1);
					                },200);
							  		//setTimeout(location.href = 'index.html',8000);
								}else{
									this.$indicator.close();
									this.$toast({
							  			message:"无法提交",
							  			position: 'center',
							  			duration: 2000
							  		});
								}
							}).catch((err) => {    
								////console.log(err);  
							});
                  		}else{
                  			this.$toast({
								message: '提示: 请上传送货单再次提交审核',
								position: 'center',
								duration: 3000
							});
							return false;
                  		}
                  		
                  		
					},
				},
				mounted:function(){
	      			this.$nextTick(function(){
						this.databuild();
					});
					this.great();
				},
			});
		</script>
	</body>

</html>