<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="piclist.aspx.cs" Inherits="XGHUNLIAN.admin.member.piclist" %>
<%@ Import Namespace="XGHUNLIAN.Common" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>会员照片列表</title>
<link href="../../css/style.css" rel="stylesheet" />
<script type="text/javascript" src="../../scripts/jquery/jquery-1.10.2.min.js"></script>
<script src="../../js/layui/layui.all.js" type="text/javascript"></script>
<link href="../../js/layui/css/layui.css" rel="stylesheet" type="text/css" />
<style type="text/css">
.userheadimg
{
width: 50px;
height: 50px;
overflow: hidden;
top: 10px;
left: 10px;
z-index: 2;
border-radius: 50px;
border: #fff solid 1px;
}
.piclist
{
width: 100%;
text-align: center;
}
.piclist ul
{
margin: 10px;
}
.piclist ul li
{
padding: 5px;
float: left;
text-align: center;
background: #fff;
border: #eee solid 1px;
}
.piclist ul li a
{
color: #000;
text-decoration: none;
}
.piclist ul li .memberimg
{
width: 200px;
height: 200px;
border-radius: 2px;
overflow: hidden;
}
.piclist ul li .del
{
width: 32px;
height: 32px;
overflow: hidden;
}
</style>
</head>
<body id="weixin" style="background: #fff;">
<form id="form1" runat="server">
<div class="hd">
<h3>
会员照片列表</h3>
</div>
<div class="bd" style="padding-top: 10px;">
<div class="content">
<div class="tab-content">
<dl>
<dt>头像：</dt>
<dd>
<asp:Image ID="Imgheadimgurl" runat="server" CssClass="userheadimg" />
</dd>
</dl>
<dl>
<dt>UID：</dt>
<dd>
<asp:Label ID="labId" runat="server"></asp:Label>
</dd>
</dl>
<dl>
<dt>OPENID：</dt>
<dd>
<asp:Label ID="labopenid" runat="server"></asp:Label>
</dd>
</dl>
<dl>
<dt>微信昵称：</dt>
<dd>
<asp:Label ID="labnickname" runat="server"></asp:Label>
</dd>
</dl>
<dl>
<dt>真实名称：</dt>
<dd>
<asp:Label ID="labzsxm" runat="server"></asp:Label>
</dd>
</dl>
<dl>
<dt>电话号码：</dt>
<dd>
<asp:Label ID="labmob" runat="server"></asp:Label>
</dd>
</dl>
</div>
<br />
<div class="piclist">
<ul>
<asp:Repeater ID="rptList" runat="server" onitemcommand="Repeater1_ItemCommand">
<ItemTemplate>
<li>
<%# htmlstr(Eval("imgurl").ToString())%>
<br />
<asp:LinkButton ID="delLinkButton" runat="server" CommandName="del" CommandArgument='<%# Eval("id") %>'><img src="../../image/del_pic.png" class="del" title="删除照片" /></asp:LinkButton>
</li>
</ItemTemplate>
<FooterTemplate>
<div style="clear: both;">
</div>
</FooterTemplate>
</asp:Repeater>
</ul>
</div>
</div>
</div>
<div class="layui-upload">
<button type="button" class="layui-btn layui-btn-normal" id="SelectList">
选择多文件</button>
<div class="layui-upload-list">
<table class="layui-table">
<thead>
<tr>
<th>
文件名
</th>
<th>
大小
</th>
<th>
状态
</th>
<th>
操作
</th>
</tr>
</thead>
<tbody id="FileList">
</tbody>
</table>
</div>
<button type="button" class="layui-btn" id="ListAction">
开始上传</button>
</div>
<div class="ft">
<div class="content">
<span class="button_b"><a href="#" onclick="javascript:history.back(-1);">返回上一页</a></span>
</div>
</div>
<div id="outerdiv" style="position: fixed; top: 0; left: 0; background: rgba(0,0,0,0.7);
z-index: 2; width: 100%; height: 100%; display: none;">
<div id="innerdiv" style="position: absolute;">
<img id="bigimg" style="border: 5px solid #fff;" src="" />
</div>
</div>
<asp:HiddenField ID="hidopenid" runat="server" />
<script type="text/javascript">
$(function () {
$(".memberimg").click(function () {
var _this = $(this); //将当前的pimg元素作为_this传入函数
imgShow("#outerdiv", "#innerdiv", "#bigimg", _this);
});
});
function imgShow(outerdiv, innerdiv, bigimg, _this) {
var src = _this.attr("src"); //获取当前点击的pimg元素中的src属性
$(bigimg).attr("src", src); //设置#bigimg元素的src属性
/*获取当前点击图片的真实大小，并显示弹出层及大图*/
$("<img/>").attr("src", src).load(function () {
var windowW = $(window).width(); //获取当前窗口宽度
var windowH = $(window).height(); //获取当前窗口高度
var realWidth = this.width; //获取图片真实宽度
var realHeight = this.height; //获取图片真实高度
var imgWidth, imgHeight;
var scale = 0.8; //缩放尺寸，当图片真实宽度和高度大于窗口宽度和高度时进行缩放
if (realHeight > windowH * scale) {//判断图片高度
imgHeight = windowH * scale; //如大于窗口高度，图片高度进行缩放
imgWidth = imgHeight / realHeight * realWidth; //等比例缩放宽度
if (imgWidth > windowW * scale) {//如宽度扔大于窗口宽度
imgWidth = windowW * scale; //再对宽度进行缩放
}
} else if (realWidth > windowW * scale) {//如图片高度合适，判断图片宽度
imgWidth = windowW * scale; //如大于窗口宽度，图片宽度进行缩放
imgHeight = imgWidth / realWidth * realHeight; //等比例缩放高度
} else {//如果图片真实高度和宽度都符合要求，高宽不变
imgWidth = realWidth;
imgHeight = realHeight;
}
$(bigimg).css("width", imgWidth); //以最终的宽度对图片缩放
var w = (windowW - imgWidth) / 2; //计算图片与窗口左边距
var h = (windowH - imgHeight) / 2; //计算图片与窗口上边距
$(innerdiv).css({ "top": h, "left": w }); //设置#innerdiv的top和left属性
$(outerdiv).fadeIn("fast"); //淡入显示#outerdiv及.pimg
});
$(outerdiv).click(function () {//再次点击淡出消失弹出层
$(this).fadeOut("fast");
});
}
</script>
<script>
layui.use('upload', function () {
var $ = layui.jquery,
upload = layui.upload;
//多文件列表
var FileListView = $('#FileList'),
uploadListIns = upload.render({
elem: '#SelectList',
// url: '/upload/',
url: ' ../../tools/UploadFile.ashx?openid=' + $("#hidopenid").val() + '',
accept: 'file',
multiple: true,
auto: false,
bindAction: '#ListAction',
choose: function (obj) {
var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
//读取本地文件
obj.preview(function (index, file, result) {
var tr = $(['<tr id="upload-' + index + '">', '<td>' + file.name + '</td>', '<td>' + (file.size / 1014).toFixed(1) + 'kb</td>', '<td>等待上传</td>', '<td>', '<button class="layui-btn layui-btn-xs demo-reload layui-hide">重传</button>', '<button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button>', '</td>', '</tr>'].join(''));
//单个重传
tr.find('.demo-reload').on('click', function () {
obj.upload(index, file);
});
//删除
tr.find('.demo-delete').on('click', function () {
delete files[index]; //删除对应的文件
tr.remove();
uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值，以免删除后出现同名文件不可选
});
FileListView.append(tr);
});
}, done: function (res, index, upload) {
if (res.code == 0) { //上传成功
var tr = FileListView.find('tr#upload-' + index),
tds = tr.children();
tds.eq(2).html('<span style="color: #5FB878;">上传成功</span>');
tds.eq(3).html(''); //清空操作
return delete this.files[index]; //删除文件队列已经上传成功的文件
}
this.error(index, upload);
},
allDone: function(obj){ //当文件全部被提交后，才触发
location.reload();
},
error: function (index, upload) {
var tr = FileListView.find('tr#upload-' + index),
tds = tr.children();
tds.eq(2).html('<span style="color: #FF5722;">上传失败</span>');
tds.eq(3).find('.demo-reload').removeClass('layui-hide'); //显示重传
}
});
});
</script>
</form>
</body>
</html>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.IO;
namespace XGHUNLIAN.tools
{
/// <summary>
/// UploadFile 的摘要说明
/// </summary>
public class UploadFile : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
//context.Response.ContentType = "text/plain";
//context.Response.Write("Hello World");
string shipin = "*.avi *.rmvb *.rm *.asf *.divx *.mpg *.mpeg *.mpe *.wmv *.mp4 *.mkv *.vob";
string allowExtension =string.Join("|",new string []{ ".jpg", ".jpeg", ".gif", ".bmp", ".png", ".JPG", ".JPEG", ".GIF", ".BMP", ".PNG" });
if (context.Request.Files.Count > 0)
{
for (int i = 0; i < context.Request.Files.Count; i++)
{
HttpPostedFile filePost = context.Request.Files[i]; // 获取上传的文件
string aFile = filePost.FileName;
string aLastName = aFile.Substring(aFile.LastIndexOf(".") + 1, (aFile.Length - aFile.LastIndexOf(".") - 1)); //扩展名
if (shipin.IndexOf(aLastName) == -1 && allowExtension.IndexOf(aLastName) == -1)
{
context.Response.Write("{\"code\":\"1\",\"data\":\"\"}");
context.Response.End();
}
string filename = "";
string filePath = SaveExcelFile(filePost,ref filename); // 保存文件并获取文件路径
BLL.wei_Member bll = new BLL.wei_Member();
if (bll.AddImgUrl(context.Request.QueryString["openid"], filename))
{
context.Response.Write("{\"code\":\"0\",\"data\":\"" + filename + "\"}");
context.Response.End();
}
context.Response.Write("{\"code\":\"1\",\"data\":\"\"}");
context.Response.End();
}
}
}
public bool IsReusable
{
get
{
return false;
}
}
public string SaveExcelFile(HttpPostedFile file,ref string filename_)
{
try
{
var fileName = file.FileName.Insert(file.FileName.LastIndexOf('.'), "-" + DateTime.Now.ToString("yyyyMMddHHmmssfff"));
var filePath = Path.Combine(HttpContext.Current.Server.MapPath("~/Upload/Image"), fileName);
string directoryName = Path.GetDirectoryName(filePath);
if (!Directory.Exists(directoryName))
{
Directory.CreateDirectory(directoryName);
}
file.SaveAs(filePath);
filename_ = fileName;
return filePath;
}
catch
{
return string.Empty;
}
}
}
}
浙公网安备 33010602011771号