[实战]MVC5+EF6+MySql企业网盘实战(10)——新建文件夹

写在前面

上篇文章更新了编辑了文件名的操作,本片文章将实现新建文件夹的功能。

系列文章

[EF]vs15+ef6+mysql code first方式

[实战]MVC5+EF6+MySql企业网盘实战(1)

[实战]MVC5+EF6+MySql企业网盘实战(2)——用户注册

[实战]MVC5+EF6+MySql企业网盘实战(3)——验证码

[实战]MVC5+EF6+MySql企业网盘实战(4)——上传头像

[Bootstrap]modal弹出框

[实战]MVC5+EF6+MySql企业网盘实战(5)——登录界面,头像等比例压缩

[实战]MVC5+EF6+MySql企业网盘实战(5)——页面模板

[实战]MVC5+EF6+MySql企业网盘实战(5)——ajax方式注册

[实战]MVC5+EF6+MySql企业网盘实战(6)——ajax方式登录

[实战]MVC5+EF6+MySql企业网盘实战(7)——文件上传

[实战]MVC5+EF6+MySql企业网盘实战(8)——文件下载、删除

[实战]MVC5+EF6+MySql企业网盘实战(9)——编辑文件名

代码片段

实现目标:可以新建文件夹。默认文件夹排在列表前面并按照时间进行排序。为了减少查询的次数,需要添加一个字段标示是否是文件夹,可置为0,文件置为1,按照这个字段排序,并按照时间进行排序。

为MyFile类添加属性,IsFolder

public int IsFolder { get; set; }

修改文件上传,文件类型为1,并修改文件列表,按照文件类型,时间排序。

        [HttpGet]
        public ActionResult FileList()
        {
            UserInfo userInfo = Session["user"] as UserInfo;
            if (userInfo == null)
            {
                return RedirectToAction("Login", "UserInfo");
            }
            var fileList = _myFileServiceRepository.FindAll(x => x.User.Id == userInfo.Id && !x.IsDelete).OrderBy(x => x.IsFolder).OrderByDescending(x => x.CreateDt);
            ViewBag.UserInfo = userInfo;
            ViewBag.ChildTitle = "我的网盘";
            return View(fileList);
        }

新建文件夹

        public JsonResult CreateFolder()
        {
            UserInfo userInfo = Session["user"] as UserInfo;

            if (userInfo == null)
            {
                RedirectToAction("Login", "UserInfo");
            }
            string folderPath = Request.Params["folderPath"];
            string folderName = Request.Params["folderName"];
            if (string.IsNullOrEmpty(folderName))
            {
                throw new ArgumentNullException("文件夹名称不能为空");
            }
            //检查文件夹是否已经存在
            var count = _myFileServiceRepository.FindAll(x => x.User.Id == userInfo.Id && x.IsFolder == 0 && x.IsDelete == false && x.FileName.Contains(folderName)).Count();
            userInfo = _userInfoServiceRepository.Find(x => x.Id == userInfo.Id);
            if (count > 0)
            {
                //如果不存在,则新建,否则进行自动重命名
                folderName = folderName + "(" + (count + 1).ToString() + ")";
            }
            if (string.IsNullOrEmpty(folderPath))
            {
                folderPath = "/NetDisk/" + userInfo.UserName;
            }
            MyFile folder = new MyFile()
            {
                FilePath = folderPath + '/' + folderName,
                FileName = folderName,
                CreateDt = DateTime.Now,
                User = userInfo,
                FileExt = string.Empty,
                FileIcon = "/Content/Images/FolderType.png",
                FileMd5 = string.Empty,
                FileSize = 0,
                IsDelete = false,
                ModifyDt = DateTime.Now
            };
            try
            {
                _myFileServiceRepository.Add(folder);
                _myFileServiceRepository.SaveChanges();
            }
            catch (Exception)
            {
                return new JsonResult() { Data = new JavaScriptSerializer().Serialize(new { code = 500, msg = "创建失败" }) };
            }
            return new JsonResult() { Data = new JavaScriptSerializer().Serialize(new { code = 200, folder = folder }) };
        }

前端

            <tbody role="alert" aria-live="polite" aria-relevant="all">
                @{int i = 0;}
                @foreach (var item in Model)
                {
                    i++;
                    <tr class="i%2==0?'even':'odd'" id="[email protected]">



                        @{
                    if (@item.FileMd5 != "")
                    {
                        <td class=" even sorting_1"><img src="@item.FileIcon" alt="" /> <span id="[email protected]">@item.FileName</span></td>
                            <td class="center ">@item.FileSize  字节</td>
                    }
                    else
                    {
                        <td class=" even sorting_1">
                            <a href="#" id="[email protected]" onclick="clickFolder('[email protected]')">
                                <img src="@item.FileIcon" alt="@item.FileName" />
                                <span id="[email protected]">@item.FileName</span>
                            </a>
                        </td>
                            <td class="center "></td>
                    }
                        }

                        <td class="center ">@item.ModifyDt</td>

                        <td class="center ">

                            <a class="btn btn-info" href="javascript:void(0)" onclick="editFile(@item.Id,'@item.FileName')">
                                <i class="glyphicon glyphicon-edit icon-white"></i>
                                编辑
                            </a>
                            <a class="btn btn-danger" href="javascript:void(0)" onclick="deleteFile(@item.Id)">
                                <i class="glyphicon glyphicon-trash icon-white"></i>
                                删除
                            </a>
                            @{ if (@item.FileMd5 != "")
                             {  <a class="btn btn-success" href="/Home/[email protected]">
                                <i class="glyphicon glyphicon-zoom-in icon-white"></i>
                                下载
                            </a> }

                            }
                        </td>
                    </tr>

                }
            </tbody>

jquery

  //创建文件夹
    $('#btnNewFolder').click(function () {
        //设置弹出框标题
        var title = $('#alertTitlte').html();
        $('#alertTitlte').html('新建文件夹');
        //清空弹出框内容
        $(".modal-body").html('');
        $(".modal-body").html('<input type="text" placeholder="请输入名称" class="form-control" name="name" value="新建文件夹" id="txtFileName" />');
        $('#txtFileName').val('');
        $('#modal-edit').modal('show');
        $('#txtFileName').val('新建文件夹');
        $('#lnkSave').unbind('click');
        $('#lnkSave').bind('click', function () {
            $.post('CreateFolder', { folderName: $('#txtFileName').val(), folderPath: $('#hdFilePath').val() }, function (data) {
                data = JSON.parse(data);
                var folder = data.folder;
                if (data.code == 200) {
                    $('<tr class="odd">   <td class=" even sorting_1" id="fileName"> <a href="#" id="lnkFolder-' + folder.Id + '" onclick="clickFolder(sp-' + folder.Id + ')"><img src="/Content/Images/FolderType.png" id="fileicon" alt="" />' + folder.FileName + '</a></td><td class="center"></td><td class="center ">' + CurentTime() + '</td><td class="center "><a class="btn btn-info" href="#"  id="fileEdit"> <i class="glyphicon glyphicon-edit icon-white"></i> 编辑 &nbsp;</a><a class="btn btn-danger" href="#"><i class="glyphicon glyphicon-trash icon-white" id="fileDelete"></i> 删除 </a> </td></tr>').insertBefore($('#fileList tbody'));
                   
                };
                //还原弹出框标题
                $('#alertTitlte').html(title);
            });
        });
       
    });

测试

 [实战]MVC5+EF6+MySql企业网盘实战(10)——新建文件夹_第1张图片

[实战]MVC5+EF6+MySql企业网盘实战(10)——新建文件夹_第2张图片

总结

 本篇文章简单实现了新建文件夹的过程。下篇文章将实现进入文件夹的过程。

你可能感兴趣的:([实战]MVC5+EF6+MySql企业网盘实战(10)——新建文件夹)