18.7 个人资料和个人设置管理

聊天室中登录用户可以对自己的信息进行管理。这主要包括两方面内容：一是个人基本信息的管理，二是个人上线和隐身等的设置。下面分别进行讲述。

18.7.1 个人资料管理页面detail.aspx

个人资料的管理主要通过detail.aspx页面文件处理的，这个页面文件负责个人资料的显示和修改。主要包括修改头像、姓名、性别、生日、手机、职位、公司、备注及添加好友设置等。页面的运行时效果如图18.16所示。

图18.16 个人资料管理运行时效果图

单击“更改头像”的超链接将显示头像选择页面，在头像选择页面选择头像后，头像选择页面自动关闭。其运行时效果如图18.17所示。

图18.17 选择头像页面运行时效果图

detail.aspx的HTML代码主要是用一个table元素来布局页面，显示个人信息。其详细实现代码如下：

//detail.aspx 的HTML页面代码

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="detail.aspx.cs" Inherits= "detail" %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c. org/TR/1999/REC-html401-19991224/loose.dtd">

<head>

<title>ziliao.gif</title>

.STYLE1 { FONT-SIZE: 12px; COLOR: #3d67d8}

.button1 {

font-size: 12px;

width: 80px;

height: 21px;

background-image: url("../images/button1.gif");

border: none;

padding-top: 3px;

}

</style>

</head>

<tbody>

<tr>

<tbody>

<tr>

<tbody>

<tr>

<img id="ziliao_r2_c2" height="27" alt="" src="images/ziliao_r2_c2.gif" width="106"

border="0" name="ziliao_r2_c2"></td>

</tr>

</tbody>

</table>

</td>

 </div>

</td>

</tr>

</tbody>

</table>

</td>

</tr>

<tr>

<img id="ziliao_r3_c2" height="379" alt="" src="images/ziliao_ r3_c2.gif" width="3"

border="0" name="ziliao_r3_c2"></td>

<tbody>

<tr>

<asp:Panel ID="Panel2" runat="server" Height= "100%" Width="100%">

<span onclick="top.frames('chatqq').changehead ();" style="cursor: pointer" id="my"

visible="false" runat="server">

<br />

更改头像</span>

</asp:Panel>

</td>

账       号: 

<asp:TextBox ID="TextBox1" runat="server" ReadOnly= "true" BorderWidth="0px" Width="90px"></asp:TextBox></td>

性     别: 

<asp:TextBox ID="TextBox2" runat="server" Border Width="0px" Width="90px"></asp:TextBox></td>

</tr>

<tr>

姓        名: 

<asp:TextBox ID="TextBox3" runat="server" Border Width="0px" Width="90px"></asp:TextBox></td>

<td>

生     日: 

<asp:TextBox ID="TextBox4" runat="server" Border Width="0px" Width="90px"></asp:TextBox></td>

</tr>

<tr>

常用手机: 

<asp:TextBox ID="TextBox5" runat="server" Border Width="0px" Width="90px"></asp:TextBox></td>

</tr>

<tr>

常用邮箱: 

<asp:TextBox ID="TextBox6" runat="server" Border Width="0px" Width="90px"></asp:TextBox></td>

</tr>

<tr>

<td>

 </td>

公司名称: 

<asp:TextBox ID="TextBox7" runat="server" Border Width="0px" Width="90px"></asp:TextBox></td>

</tr>

<tr>

<td>

 </td>

部     门:    

<asp:TextBox ID="TextBox8" runat="server" Border Width="0px" Width="90px"></asp:TextBox></td>

<td>

职      务: 

<asp:TextBox ID="TextBox11" runat="server" Border Width="0px" Width="90px"></asp:TextBox></td>

</tr>

<tr>

<td>

 </td>

隶属行业: 

<asp:TextBox ID="TextBox9" runat="server" Border Width="0px" Width="90px"></asp:TextBox></td>

<td>

 </td>

</tr>

<tr>

<td>

 </td>

公司地址: 

<asp:TextBox ID="TextBox10" runat="server" Border Width="0px" Width="90px"></asp:TextBox></td>

</tr>

<tr>

<td>

 </td>

开户银行: 

<asp:TextBox ID="TextBox12" runat="server" BorderWidth="0px" Width="90px"></asp:TextBox></td>

</tr>

<tr>

<td>

 </td>

账     号:   

<asp:TextBox ID="TextBox13" runat="server" BorderWidth="0px" Width="90px"></asp:TextBox></td>

<td>

 </td>

</tr>

<tr>

<td>

 </td>

备      注: 

<asp:TextBox ID="TextBox14" Style="overflow: auto" runat="server" BorderWidth="0px"

TextMode="MultiLine" Width="240px"></asp:TextBox></td>

</tr>

<tr>

<td>

 </td>

</tr>

<tr>

<td>

 </td>

</tr>

<tr>

<td>

 </td>

</tr>

<tr>

<td>

</td>

<asp:Panel ID="Panel1" runat="server" Height= "100%" Visible="False" Width="100%">

<asp:RadioButtonList ID="RadioButtonList1" runat="server">

<asp:ListItem>把我加为好友时需要验证</asp: ListItem>

<asp:ListItem Selected="True">允许任何人把我加为好友</asp:ListItem>

<asp:ListItem>不允许任何人把我加为好友</asp:ListItem>

</asp:RadioButtonList></asp:Panel>

</td>

</tr>

</tbody>

</table>

</td>

<img id="ziliao_r3_c5" height="379" alt="" src="images/ ziliao_r3_c5.gif" width="3"

border="0" name="ziliao_r3_c5"></td>

</tr>

<tr>

<tbody>

<tr>

 </td>

<input id="delblack" runat="server" class="button1" name="Button" type="button" value="移除黑名单"

style="background: #aeddf7; color: #044B9A" onserverclick="delblack_ServerClick"

visible="false" /></td>

<asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="images/ziliao_r6_c11.gif"

Enabled="False" OnClick="ImageButton1_Click" /></td>

</tr>

</tbody>

</table>

</td>

</tr>

<tr>

<img id="ziliao_r5_c2" height="3" alt="" src="images/ziliao_ r5_c2.gif" width="505"

border="0" name="ziliao_r5_c2">

</td>

</tr>

<tr>

</td>

</td>

</td>

<td>

</td>

</tr>

</tbody>

</table>

</form>

</body>

</html>

18.7.2 个人资料管理的服务器端代码detail.aspx.cs

detail.aspx.cs文件实现的功能有：页面加载时显示用户的个人资料，单击“应用”按钮更新个人资料，把当前用户从黑名单中移除出去。其具体实现代码只是对数据库操作。detail.aspx.cs的完整实现代码如下：

//detail.aspx.cs文件的代码

using System;

using System.Data;

using System.Configuration;

using System.Collections;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

using MyChat;

public partial class detail : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

if(!IsPostBack)

{

if(Request.QueryString["type"] == "black")//是否要显示黑名单中的用户

{

delblack.Visible = true;

}

string ng = Request.QueryString["userid"]; //要查看者的id

if(ng == null && User.Identity.IsAuthenticated)//显示自己的个人资料

{

ng = tools.GetUserId(User.Identity.Name); //获取账号

Panel1.Visible = true;

ImageButton1.Enabled = true;

for(int j = 1; j <= 14; j++) //显示输入框效果

{

string te = "TextBox" + j.ToString();

((TextBox)(this.FindControl(te))).BorderWidth = 1;

my.Visible = true;

}

MyChat.Sql s = new MyChat.Sql();

string str = "select * from userinfo where userid = " + ng;

System.Data.SqlClient.SqlDataReader r = s.GetReader(str);//取得用户资料

if(r.Read()) //显示用户资料

{

if (r["username"] != DBNull.Value) TextBox1.Text = r["username"]. ToString();

if (r["sex"] != DBNull.Value) TextBox2.Text = r["sex"].ToString();

if (r["realname"] != DBNull.Value) TextBox3.Text = r["realname"]. ToString();

if (r["birthday"] != DBNull.Value) TextBox4.Text = r["birthday"]. ToString();

if (r["tel"] != DBNull.Value) TextBox5.Text = r["tel"].ToString();

if (r["email"] != DBNull.Value) TextBox6.Text = r["email"]. ToString();

if (r["company"] != DBNull.Value) TextBox7.Text = r["company"]. ToString();

if (r["department"] != DBNull.Value) TextBox8.Text = r["department"]. ToString();

if (r["jobposition"] != DBNull.Value) TextBox11.Text = r["jobposition"]. ToString();

if (r["jobclass"] != DBNull.Value) TextBox9.Text = r["jobclass"]. ToString();

if (r["companyaddr"] != DBNull.Value) TextBox10.Text = r["companyaddr"]. ToString();

if (r["bankcode"] != DBNull.Value)TextBox13.Text = r["bankcode"]. ToString();

if (r["bank"] != DBNull.Value)TextBox12.Text = r["bank"].ToString();

if (r["notes"] != DBNull.Value) TextBox14.Text = r["notes"]. ToString();

if(r["head"] != DBNull.Value)//头像

{

myface.Src = "face/" + r["head"].ToString();

ClientScript.RegisterStartupScript(this.GetType(), "getm",

"document.getElementById('selectedvalue').value='" + r["head"].

ToString() + "';", true);

}

//好友设置选项

if (Request.QueryString["userid"] == null && User.Identity. IsAuthenticated)

{

string sdf = "";

if(r["canaddfriend"] != DBNull.Value)

sdf = r["canaddfriend"].ToString();

RadioButtonList1.SelectedIndex = int.Parse(sdf);//设置选择项

}

r.Close();

}

// 删除黑名单

protected void delblack_ServerClick(object sender, EventArgs e)

{

string gid = Request.QueryString["username"]; //获取账号

MyChat.Sql s = new MyChat.Sql();

string sql = "delete from friend where userid =" + tools.GetUser Id(User.Identity.Name) + " and type =1 and othername= '" + gid + "' ";

s.ExecuteSql(sql); //删除记录

ClientScript.RegisterStartupScript(this.GetType(), "sde", "top.frames ('chatqq').myAlert('您已经成功把该用户移除黑名单！！');top.frames('chatqq').closeInfoWnd ('myt');", true); //删除成功的提示

}

//修改个人资料

protected void ImageButton1_Click(object sender, ImageClickEventArgs e)

{

//执行修改个人资料的存储过程

MyChat.Sql s = new MyChat.Sql();

s.command.Parameters.AddWithValue("@userid", tools.GetUserId(User.Identity.Name));

s.command.Parameters.AddWithValue("@username", TextBox1.Text);

s.command.Parameters.AddWithValue("@sex", TextBox2.Text);

s.command.Parameters.AddWithValue("@realname", TextBox3.Text);

s.command.Parameters.AddWithValue("@birthday", TextBox4.Text);

s.command.Parameters.AddWithValue("@tel", TextBox5.Text);

s.command.Parameters.AddWithValue("@email", TextBox6.Text);

s.command.Parameters.AddWithValue("@company", TextBox7.Text);

s.command.Parameters.AddWithValue("@department", TextBox8.Text);

s.command.Parameters.AddWithValue("@jobposition", TextBox11.Text);

s.command.Parameters.AddWithValue("@jobclass", TextBox9.Text);

s.command.Parameters.AddWithValue("@companyaddr", TextBox10.Text);

s.command.Parameters.AddWithValue("@bankcode", TextBox13.Text);

s.command.Parameters.AddWithValue("@bank", TextBox2.Text);

s.command.Parameters.AddWithValue("@notes", TextBox14.Text);

s.command.Parameters.AddWithValue("@canaddfriend", RadioButtonList1. SelectedIndex);

s.command.Parameters.AddWithValue("@head", Request.Form["selectedhead"]);

s.Con.Open();

s.exec("updatechatuserinfo");

//更改头像显示

ClientScript.RegisterStartupScript(this.GetType(), "getm", "document.

getElementById('myface').src=\"face/" + Request.Form["selectedhead"] +

"\";", true);

//提示修改成功

ClientScript.RegisterStartupScript(this.GetType(), "ea", "top.frames ('chatqq').myAlert('修改成功!!');", true);

}

18.7.3 上线、隐身设置

文本框:
图18.18 上线、隐身
设置的运行效果用户可以设置自己的上线和隐身状态，如果设置为隐身，则即使用户上线，在别人的QQ中他依旧显示是未上线状态。单击QQ菜单条右上角的深色的下三角形，可显示隐身和上线的选择菜单。选择其中一项后即可关闭这个层，这是通过异步执行配置操作来实现的。执行效果如图18.18所示。

聊天用户上线显示配置菜单是由客户端函数showOnlineConfig()来实现的，它的实现代码如下：

//显示在线还是隐身的配置

function showOnlineConfig()

{

//取得当前位置

var mx = window.event.x;

var my = window.event.y;

var div = document.createElement("div"); //创建一个div，然后赋予它一些属性

div.style.fontSize="11px";

div.id = "ayer";

div.style.color ="blue";

div.style.backgroundColor="#B2D7F2";

//字符串表示

var html = "\

<span style='align:right;' onclick=\"$(Label3).innerText='在线';Request.sendGET ('config.ashx?status=1&rnd=10000*Math.random()',null,null,null,null);closeme('"+div.id;

html += "');\">上线</span></br>\

<span style='align:right;' onclick=\"$(Label3).innerText='隐身';Request.sendGET ('config.ashx?status=0&rnd=10000*Math.random()',null,null,null,null);closeme('"+div.id;

html += "');\">隐身</span><br/>";

div.innerHTML = html

div.style.position = "absolute";

div.style.left = mx-10+"px";

div.style.top = my+"px";

document.body.appendChild(div);

}

从上面的代码可以看出，当用户选择一种状态后，客户端Requst类将异步调用Config.ashx来实现配置操作。Config.ashx的代码如下：

<%@ WebHandler Language="C#" Class="config" %>

using System;

using System.Web;

public class config : IHttpHandler, System.Web.SessionState.IRequiresSessionState