<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>

<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'PubLost.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->

  </head>
  
  <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
  
  <style>
  body{
  background: #FFF8DC;
  }
  .nav{
  position:relative;
  width:900px;
  margin: 0  auto;
  height:100px;
  text-align: center;
  background: #3CB371;
  }
  .bord{
  position:relative;
  width:900px;
  margin: 0  auto;
  background: white;
  }
  .nav a{
  position: relative;
  margin-top: 10px;
  color: black;
  top:30px;
  font-size: 30px;
  color: white;
  }
   select{
  height:40px;
  width:400px;
  	border: 1px solid #D4D4D4;
  	}
  .form-control{
  height:40px;
  width:263px;
  	border: 1px solid #D4D4D4;
  }
  
  .container{
    border: 1px solid #DCDCDC;
    padding-left: 50px;
    padding-top: 30px;
  }
  input {
	height:40px;
	border-radius:5px;
	border: 1px solid #D4D4D4;
	text-indent: 20px;
}
.row{
margin-top: 10px;
}
.lbl{
margin-bottom: 5px;
}
input{
width:800px;
}
.submit{
margin-top: 40px;
}
.in{
width:800px;
}
  </style>
  
  <body>
  <div class="nav">
  <a>————</a><a style="margin: 0 40px;">发布闲置</a><a>————</a>
  </div>
<div class="bord">
<div class="container">
            <s:form class="contact" action="Fbxz" method="post" id="form" enctype="multipart/form-data" onsubmit="" name="form">





            <div class="row clearfix">
                <div class="lbl">
                    <label for="name">
                       标题</label>
                </div>
                <div class="ctrl">
                    <s:textfield name="xz.title" data-required="true" data-validation="text" data-msg="Invalid Name" placeholder="很重要，显示在列表页" />
                </div>
            </div>
            
            <div class="row clearfix">
                <div class="lbl">
                    <label for="email">
                        简介</label>
                </div>
                <div class="ctrl">
                
                    <s:textfield name="xz.desc" cssClass="in" rows="6" cols="10" placeholder="描述一下你曾经的宝贝吧~" />
                </div>
            </div>
            
            <div class="row clearfix">
                <div class="lbl">
                    <label for="微信号">
                        标价</label>
                </div>
                <div class="ctrl">
                    <s:textarea cssClass="in"  name="xz.sep" data-required="true" data-validation="custom" data-msg="Invalid Phone #" placeholder="想多少钱出手呢？"/>
                </div>
            </div>
            
             <div class="row clearfix">
                <div class="lbl">
                    <label for="微信号">
                        原价</label>
                </div>
                <div class="ctrl">
                    <s:textarea cssClass="in" name="xz.orp" data-required="true" data-validation="custom" data-msg="Invalid Phone #" placeholder="购买时的价格哦"/>
                </div>
            </div>
            
           <div class="row clearfix">
                <div class="lbl">
                    <label for="微信号">
                       邮费</label>
                </div>
                <div class="ctrl">
                    <s:textarea cssClass="in" id="phone" name="xz.postage" data-required="true" data-validation="custom" data-msg="Invalid Phone #" placeholder="也可以选择商议哦"/>
                </div>
            </div>
            
             <div class="row clearfix">
                <div class="lbl">
                    <label for="微信号">
                       微信号</label>
                </div>
                <div class="ctrl">
                    <s:textarea cssClass="in" id="phone" name="xz.wx" data-required="true" data-validation="custom" data-msg="Invalid Phone #" placeholder="微信号，手机号，QQ号要至少填一项的！"/>
                </div>
            </div>
            
             <div class="row clearfix">
                <div class="lbl">
                    <label for="微信号">
                       手机号</label>
                </div>
                <div class="ctrl">
                    <s:textarea cssClass="in" id="phone" name="xz.tel" data-required="true" data-validation="custom" data-msg="Invalid Phone #" placeholder="微信号，手机号，QQ号要至少填一项的！ "/>
                </div>
            </div>
            
            <div class="row clearfix">
                <div class="lbl">
                    <label for="微信号">
            QQ号</label>
                </div>
                <div class="ctrl">
                    <s:textarea cssClass="in" id="phone" name="xz.qq" data-required="true" data-validation="custom" data-msg="Invalid Phone #" placeholder="微信号，手机号，QQ号要至少填一项的！ "/>
                </div>
            </div>
				
<!--  			 		
            <div class="row  clearfix"><div class="lbl">
                  <label>上传图片：</label></div>
           <div class="ctrl"> 
		  <div style="display: none" id="myss"> <img id="img" src="">
			   <div style="height: 20px"></div>
			   </div>
	       <input id="file" type="file" onchange="compress()" name="file" style="height:25px;border:none">
			  <input type="hidden" value="" name="image" id="image">
			   <script>

// 对图片进行压缩
function compress() { 
    let fileObj = document.getElementById('file').files[0] ;//上传文件的对象
    let reader = new FileReader();
    reader.readAsDataURL(fileObj);
    reader.onload = function(e) {
        let image = new Image() //新建一个img标签（还没嵌入DOM节点)
        image.src = e.target.result
        image.onload = function() {
            let canvas = document.createElement('canvas'), 
            context = canvas.getContext('2d'),
		    may=300/image.width,
            imageWidth =300,    //压缩后图片的大小
            imageHeight = image.height*may,
            data = '';

            canvas.width = imageWidth;
            canvas.height = imageHeight;

            context.drawImage(image, 0, 0, imageWidth, imageHeight);
            data = canvas.toDataURL('image/jpeg');
			

            //压缩完成 
            document.getElementById('img').src = data;
			document.getElementById('image').value =data;
			
			var div = document.getElementById("myss");
			 div.style.setProperty('display','block');
			
        }
    }
}

</script>
            </div>
            </div>
		
		    <input type="hidden" value="1577948535" name="senddate">
			<input type="hidden" value="1577948535" name="sortrank">
			<input type="hidden" value="1577948535" name="arcrank">
			<input type="hidden" value="1" name="typeid">
			<input type="hidden" value="20" name="channelid">
			<input type="hidden" value="1" name="type">
			
-->	
            <div class="row  clearfix">
                <div class="span10 offset2">
                    <s:submit cssClass="submit" value="确认发布" />
                </div>
            </div>
				   <div style="clear: both"></div>
            </s:form>
   <div style="clear: both"></div>
        </div>
</div>
  </body>
</html>

