仿花田：相亲网站意中人已在GitHub上开源

在园友的强烈呼唤下，我还是负责任的分享给大家，因为对代码比较熟悉一下，还是有些问题要说明，不然别人看起来会比较费劲。说实话除了这个bootstrap的界面风格和这件事情本身对大家有吸引力之外，内部的逻辑，结构，可能有些捉襟见肘，会让大家见笑，大牛们完全可以略过.现在源码已经让我推到GitHub上面去了。我先从头到尾的介绍一下，然后说一些存在的问题。也希望大家给出更好的建议。

一、结构说明

1.MVC 我先说模型，共有20几张表，支持数据迁移。BaseInfos(基本资料)，DetailInfos(详细资料),LoveViews(恋爱观) 应该是做到一张User表中的，脑抽的我把他们分成了三张表，因为他们是分别存储的。下载之后，改成你自己的数据库，运行就能创建新表了。

using System;
using System.Collections.Generic;
using System.Data.Entity;
using Findlover.Migrations;

namespace Findlover.Models
{
    public class LoveDb:DbContext
    {
        private const string DbNameOrDbConnectionstring =
           
          "Data Source=your-pc;Initial Catalog=LoveDB;User ID=sa;Password=code;Persist Security Info=True";  
        //Persist Security Info=True
        public DbSet<BaseInfo> BaseInfos { get; set; }// 基本资料
        public DbSet<User> Users { get; set; }// 用户
        public DbSet<Requirement> Requirements { get; set; }//择偶需求
        public DbSet<DetailInfo> DetailInfos { get; set; }//详细资料
        public DbSet<LoveView> LoveViews { get; set; }//恋爱观
        public DbSet<InfoStatistic> InfoStatistics { get; set; }// 信息统计，统计用户资料的完整度。避免每次都要去三张表数一遍。
        public DbSet<UserHot> UserHots { get; set; }//用户的人热度
        public DbSet<Praise> Praises { get; set; }//赞 也就是喜欢
        public DbSet<State> States { get; set; }// 状态
        public DbSet<Iamgbox> Iamgboxes { get; set; }// 相册
        public DbSet<Message> Messages { get; set; }//私信
        public DbSet<LoginLog> LoginLogs { get; set; }// 登录日志记录
        public DbSet<Role> Roles { get; set; }//角色
        public DbSet<Hello> Hellos { get; set; }//打招呼
        public DbSet<RoleLog> RoleLogs { get; set; }// 角色的日志
        public DbSet<Authority> Authoritys { get; set; }// 权限
        public DbSet<AdminStatistic> AdminStatistics { get; set; }//管理员操作统计 这个功能没有多大意义 你可拿掉
        public DbSet<VisitLog> VisitLogs { get; set; }// 访问记录
        public DbSet<Report> Reports { get; set; }//举报
        public DbSet<ReportLog> ReportLogs { get; set; }//举报日志
        public DbSet<MyLove> MyLoves { get; set; }// 我喜欢的人
        public DbSet<DisLove> DisLoves { get; set; }//我不喜欢的人 相当于黑名单
        public DbSet<Topic> Topics { get; set; }// 话题
        public DbSet<Comment> Comments { get; set; }//评论
        public DbSet<EnjoyTopic> EnjoyTopics { get; set; }//感兴趣的话题
        public LoveDb() : base(DbNameOrDbConnectionstring)
        {
            Database.SetInitializer(new MigrateDatabaseToLatestVersion<LoveDb, Configuration<LoveDb>>());
        }
    }
}

2. 控制器：共有8个控制器，其中BaseController 里面集合一些常用的方法和属性，其他都继承这个控制器，其他看名字你也知道是干啥的，Interactive是对应的Topic，本来是打算一个专门用来做交互的控制器。现在只有话题。但可能让大家恼火的就是，这分的还不细致，不准确。之前自己偷懒，什么方法写在什么控制器没有明确的定义清楚，这对以后维护和扩展造成不方便。

仿花田：相亲网站意中人已在GitHub上开源

3.视图：主要是基于Bootstrap2,Jquery1.7.2.，form.js 注册的日期控件和Topic的编辑器用的是KendoUi, 小伙伴们可以去换成Ckeditor，而Bootstrap用的地方主要是在

Layout的导航，后台导航，举报、私信、图片上传的模态对话框，在主页面使用它的栅格比较少，因为老是和导航对不齐，就放弃了。或许是我用的不对。Jquery用来交互，获取数据。form.js 用的比较多，很多地方是form提交，没有用MVC自带的Create。原因就是不好看，而且不好控制，ie下面会走样。

二、前端特别说明

这里特别要说明的就是一些函数和窗口的触发

1.图片上传和举报框。

在用户主页的视图和PersonalInfo视图中会有这两个相似的html代码，是用来触发图片上传框的。

  <div class="infopercentright">上传4张照片,资料完整度+8%  <a class="infotag" id="imgup"  href="#imgupload" data-toggle="modal" title="上传照片"><i class="icon-camera"></i></a> </div>

   <a class="infotag" id="imgupload"  href="#imgupload" data-toggle="modal" title="上传照片"><i class="icon-camera"></i></a>

图片上传的模态对话框：

    <div id="imgupload" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4>上传图片</h4>  
        </div>
        <div class="modal-body">
            <div class="uploadbox" data-count="0" style="display: inline;">
                <span class="closespan" title="删除照片">&times;</span>
                <div class="imgcontainer">
                    <div class="add">+</div>
                    <div class="stt">点击上传</div>
                </div>
                <span class="infospan">
                    <img src='../../Content/Photos/loading.gif' />正在上传...</span>
            </div> 
            <div class="uploadbox" data-count="0"  >
                <span class="closespan" title="删除照片">&times;</span>
                <div class="imgcontainer">
                    <div class="add">+</div>
                    <div class="stt">点击上传</div>
                </div>
                <span class="infospan"> <img src='../../Content/Photos/loading.gif' />正在上传...</span>
            </div> 
            <div class="uploadbox"data-count="0" >
                <span class="closespan" title="删除照片">&times;</span>
                <div class="imgcontainer">
                    <div class="add">+</div>
                    <div class="stt">点击上传</div>
                </div>
                <span class="infospan"> <img src='../../Content/Photos/loading.gif' />正在上传...</span>
            </div> 
            <div class="uploadbox"data-count="0"  >
                <span class="closespan" title="删除照片">&times;</span>
                <div class="imgcontainer">
                    <div class="add">+</div>
                    <div class="stt">点击上传</div>
                </div>
                <span class="infospan"> <img src='../../Content/Photos/loading.gif' />正在上传...</span>
            </div> 
            <div class="inputdiv"><input type="text" disabled="disabled" id="Remark" name="Remark" placeholder="补充说明下~"/></div>
        </div>
        <div class="modal-footer">
            上传大小在8k-10M之间 <span class="imguploadmessage"></span>
            <button class="btn btn-success "  disabled="disabled"   id="imgsubmit">发布</button>
            <form action="/User/UpLoadPhoto" method="POST" enctype="multipart/form-data" name="ImgForm" id="ImgForm">
                <input type="file" name="file" id="imgFlie"  required="required" />
                <input type="submit" name="subt" value="上传图片" />
            </form>
        </div>
    </div>

View Code