ssm+vue661基于Web的数字家庭网站设计与实现


博主介绍:专注于Java(springboot ssm 等开发框架) vue  .net  php phython node.js    uniapp 微信小程序 等诸多技术领域和毕业项目实战、企业信息化系统建设,从业十五余年开发设计教学工作
☆☆☆ 精彩专栏推荐订阅☆☆☆☆☆不然下次找不到哟
我的博客空间发布了1500+毕设题目 方便大家学习使用
感兴趣的可以先收藏起来,还有大家在毕设选题,项目以及论文编写等相关问题都可以给我留言咨询,希望帮助更多的人
更多项目地址 介绍  翰文编程CSDN博客 翰文编程-CSDN博客
文末下方有源码获取地址

    1. 系统结构设计

系统结构设计就像一个树状结构一样,一个树干有很多分支,大任务相当于树干,小任务相当于树枝,只有需求分析信息弄清楚之后,才能保证每个小任务都能实现目标,对初步设计好的系统再进行不断优化,最终得到一个具体现实的系统结构。

管理员功能模块和用户功能模块是该数字家庭网站的两大部分,系统结构如图4-2所示。

图4-2 系统结构图

4.3 数据库设计

开发一个系统也需要提前设计数据库。这里的数据库是相关数据的集合,存储在一起的这些数据也是按照一定的组织方式进行的。目前,数据库能够服务于多种应用程序,则是源于它存储方式最佳,具备数据冗余率低的优势。虽然数据库为程序提供信息存储服务,但它与程序之间也可以保持较高的独立性。总而言之,数据库经历了很长一段时间的发展,从最初的不为人知,到现在的人尽皆知,其相关技术也越发成熟,同时也拥有着坚实的理论基础。

4.3.1 数据库概念设计

这部分内容需要借助数据库关系图来完成,也需要使用专门绘制数据库关系图的工具,比如Visio工具就可以设计E-R图(数据库关系图)。设计数据库,也需要按照设计的流程进行,首先还是要根据需求完成实体的确定,分析实体具有的特征,还有对实体间的关联关系进行确定。最后才是使用E-R模型的表示方法,绘制本系统的E-R图。不管是使用亿图软件,还是Visio工具,对于E-R模型的表示符号都一样,通常矩形代表实体,实体间存在的关系用菱形符号表示,实体的属性也就是实体的特征用符号椭圆表示。最后使用直线将矩形,菱形和椭圆等符号连接起来。接下来就开始对本系统的E-R图进行绘制。

(1)下图是论坛实体和其具备的属性。


图4.1 论坛实体属性图

(2)下图是用户实体和其具备的属性。


图4.2 用户实体属性图

(3)下图是家庭日记实体和其具备的属性。


图4.3 家庭日记实体属性图

(4)下图是字典表实体和其具备的属性。


图4.4 字典表实体属性图

(5)下图是家庭亲子视频实体和其具备的属性。


图4.5 家庭亲子视频实体属性图

(6)下图是亲友动态实体和其具备的属性。


图4.6 亲友动态实体属性图

(7)下图是用户表实体和其具备的属性。


图4.7 用户表实体属性图

(8)下图是家庭寄语实体和其具备的属性。


图4.8 家庭寄语实体属性图

(9)下图是新闻信息实体和其具备的属性。


图4.9 新闻信息实体属性图

      1. 数据库表设计

采用MYSQL数据库对该数字家庭网站的数据进行存储,数据库中所包括的各个数据库表的详细信息如下所示:

表4.1字典表表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

2

dic_code

String

字段

3

dic_name

String

字段名

4

code_index

Integer

编码

5

index_name

String

编码名字

6

super_id

Integer

父字段id

7

beizhu

String

备注

8

create_time

Date

创建时间

表4.2论坛表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

2

forum_name

String

帖子标题

3

yonghu_id

Integer

用户

4

users_id

Integer

管理员

5

forum_content

String

发布内容

6

super_ids

Integer

父id

7

forum_state_types

Integer

帖子状态

8

insert_time

Date

发帖时间

9

update_time

Date

修改时间

10

create_time

Date

创建时间

表4.3家庭寄语表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

2

jiatingriji_name

String

寄语标题

3

jiatingjiyu_text

String

寄语内容

4

yonghu_id

Integer

用户

5

insert_time

Date

创建时间

6

create_time

Date

创建时间

表4.4家庭亲子视频表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

2

jiatingqinzishipin_name

String

亲子视频标题

3

jiatingqinzishipin_types

Integer

视频类型

4

jiatingqinzishipin_photo

String

封面

5

jiatingqinzishipin_video

String

视频类型

6

yonghu_id

Integer

用户

7

jiatingqinzishipin_content

String

视频详情

8

insert_time

Date

添加时间

9

create_time

Date

创建时间

表4.5家庭日记表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

2

jiatingriji_name

String

日记标题

3

jiatingriji_types

Integer

日记类型

4

jiatingriji_photo

String

图片

5

yonghu_id

Integer

用户

6

jiatingriji_time

Date

记录日期

7

jiatingriji_content

String

日记内容

8

insert_time

Date

创建时间

9

create_time

Date

创建时间

表4.6新闻信息表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

2

news_name

String

新闻标题

3

news_types

Integer

新闻类型

4

news_photo

String

新闻图片

5

insert_time

Date

新闻时间

6

news_content

String

新闻详情

7

create_time

Date

创建时间

表4.7亲友动态表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

2

qinyoumokuai_name

String

动态标题

3

qinyoumokuai_types

Integer

动态类型

4

qinyoumokuai_photo

String

封面

5

yonghu_id

Integer

用户

6

qinyoumokuai_content

String

动态详情

7

insert_time

Date

添加时间

8

create_time

Date

创建时间

表4.8用户表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

2

yonghu_name

String

用户姓名

3

yonghu_photo

String

头像

4

yonghu_phone

String

联系方式

5

yonghu_email

String

邮箱

6

yonghu_types

Integer

家庭

7

shenfen_types

Integer

身份

8

yonghu_delete

Integer

假删

9

create_time

Date

创建时间

表4.9用户表表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

2

username

String

用户名

3

password

String

密码

4

role

String

角色

5

addtime

Date

新增时间

  1. 系统的实现
    1. 功能模块的实现

5.1用户信息管理

如图5.1显示的就是用户信息管理页面,此页面提供给管理员的功能有:用户信息的查询管理,可以删除用户信息、修改用户信息、新增用户信息,

还进行了对用户名称的模糊查询的条件

图5.1 用户信息管理页面

5.2 家庭日记管理

如图5.2显示的就是家庭日记管理页面,此页面提供给管理员的功能有:查看已发布的家庭日记数据,修改家庭日记,家庭日记作废,即可删除,还进行了对家庭日记名称的模糊查询 家庭日记信息的类型查询等等一些条件。

图5.2 家庭日记管理页面

5.3家庭视频管理

如图5.3显示的就是家庭视频管理页面,此页面提供给管理员的功能有:根据家庭视频进行条件查询,还可以对家庭视频进行新增、修改、查询操作等等。

图5.3 家庭视频管理页面

主要代码

  /**
    * 后端列表
    */
    @RequestMapping("/page")
    public R page(@RequestParam Map<String, Object> params, HttpServletRequest request){
        logger.debug("page方法:,,Controller:{},,params:{}",this.getClass().getName(),JSONObject.toJSONString(params));
        String role = String.valueOf(request.getSession().getAttribute("role"));
        if(false)
            return R.error(511,"永不会进入");
        else if("用户".equals(role))
            params.put("yonghuId",request.getSession().getAttribute("userId"));
        if(params.get("orderBy")==null || params.get("orderBy")==""){
            params.put("orderBy","id");
        }
        PageUtils page = jiatingqinzishipinService.queryPage(params);

        //字典表数据转换
        List<JiatingqinzishipinView> list =(List<JiatingqinzishipinView>)page.getList();
        for(JiatingqinzishipinView c:list){
            //修改对应字典表字段
            dictionaryService.dictionaryConvert(c, request);
        }
        return R.ok().put("data", page);
    }

    /**
    * 后端详情
    */
    @RequestMapping("/info/{id}")
    public R info(@PathVariable("id") Long id, HttpServletRequest request){
        logger.debug("info方法:,,Controller:{},,id:{}",this.getClass().getName(),id);
        JiatingqinzishipinEntity jiatingqinzishipin = jiatingqinzishipinService.selectById(id);
        if(jiatingqinzishipin !=null){
            //entity转view
            JiatingqinzishipinView view = new JiatingqinzishipinView();
            BeanUtils.copyProperties( jiatingqinzishipin , view );//把实体数据重构到view中

                //级联表
                YonghuEntity yonghu = yonghuService.selectById(jiatingqinzishipin.getYonghuId());
                if(yonghu != null){
                    BeanUtils.copyProperties( yonghu , view ,new String[]{ "id", "createTime", "insertTime", "updateTime"});//把级联的数据添加到view中,并排除id和创建时间字段
                    view.setYonghuId(yonghu.getId());
                }
            //修改对应字典表字段
            dictionaryService.dictionaryConvert(view, request);
            return R.ok().put("data", view);
        }else {
            return R.error(511,"查不到数据");
        }

    }

    /**
    * 后端保存
    */
    @RequestMapping("/save")
    public R save(@RequestBody JiatingqinzishipinEntity jiatingqinzishipin, HttpServletRequest request){
        logger.debug("save方法:,,Controller:{},,jiatingqinzishipin:{}",this.getClass().getName(),jiatingqinzishipin.toString());

        String role = String.valueOf(request.getSession().getAttribute("role"));
        if(false)
            return R.error(511,"永远不会进入");
        else if("用户".equals(role))
            jiatingqinzishipin.setYonghuId(Integer.valueOf(String.valueOf(request.getSession().getAttribute("userId"))));

        Wrapper<JiatingqinzishipinEntity> queryWrapper = new EntityWrapper<JiatingqinzishipinEntity>()
            .eq("jiatingqinzishipin_name", jiatingqinzishipin.getJiatingqinzishipinName())
            .eq("jiatingqinzishipin_types", jiatingqinzishipin.getJiatingqinzishipinTypes())
            .eq("jiatingqinzishipin_video", jiatingqinzishipin.getJiatingqinzishipinVideo())
            .eq("yonghu_id", jiatingqinzishipin.getYonghuId())
            ;

        logger.info("sql语句:"+queryWrapper.getSqlSegment());
        JiatingqinzishipinEntity jiatingqinzishipinEntity = jiatingqinzishipinService.selectOne(queryWrapper);
        if(jiatingqinzishipinEntity==null){
            jiatingqinzishipin.setInsertTime(new Date());
            jiatingqinzishipin.setCreateTime(new Date());
            jiatingqinzishipinService.insert(jiatingqinzishipin);
            return R.ok();
        }else {
            return R.error(511,"表中有相同数据");
        }
    }

    /**
    * 后端修改
    */
    @RequestMapping("/update")
    public R update(@RequestBody JiatingqinzishipinEntity jiatingqinzishipin, HttpServletRequest request){
        logger.debug("update方法:,,Controller:{},,jiatingqinzishipin:{}",this.getClass().getName(),jiatingqinzishipin.toString());

        String role = String.valueOf(request.getSession().getAttribute("role"));
//        if(false)
//            return R.error(511,"永远不会进入");
//        else if("用户".equals(role))
//            jiatingqinzishipin.setYonghuId(Integer.valueOf(String.valueOf(request.getSession().getAttribute("userId"))));
        //根据字段查询是否有相同数据
        Wrapper<JiatingqinzishipinEntity> queryWrapper = new EntityWrapper<JiatingqinzishipinEntity>()
            .notIn("id",jiatingqinzishipin.getId())
            .andNew()
            .eq("jiatingqinzishipin_name", jiatingqinzishipin.getJiatingqinzishipinName())
            .eq("jiatingqinzishipin_types", jiatingqinzishipin.getJiatingqinzishipinTypes())
            .eq("jiatingqinzishipin_video", jiatingqinzishipin.getJiatingqinzishipinVideo())
            .eq("yonghu_id", jiatingqinzishipin.getYonghuId())
            ;

        logger.info("sql语句:"+queryWrapper.getSqlSegment());
        JiatingqinzishipinEntity jiatingqinzishipinEntity = jiatingqinzishipinService.selectOne(queryWrapper);
        if("".equals(jiatingqinzishipin.getJiatingqinzishipinPhoto()) || "null".equals(jiatingqinzishipin.getJiatingqinzishipinPhoto())){
                jiatingqinzishipin.setJiatingqinzishipinPhoto(null);
        }
        if("".equals(jiatingqinzishipin.getJiatingqinzishipinVideo()) || "null".equals(jiatingqinzishipin.getJiatingqinzishipinVideo())){
                jiatingqinzishipin.setJiatingqinzishipinVideo(null);
        }
        if(jiatingqinzishipinEntity==null){
            jiatingqinzishipinService.updateById(jiatingqinzishipin);//根据id更新
            return R.ok();
        }else {
            return R.error(511,"表中有相同数据");
        }
    }

    /**
    * 删除
    */
    @RequestMapping("/delete")
    public R delete(@RequestBody Integer[] ids){
        logger.debug("delete:,,Controller:{},,ids:{}",this.getClass().getName(),ids.toString());
        jiatingqinzishipinService.deleteBatchIds(Arrays.asList(ids));
        return R.ok();
    }

5.1新闻信息管理

如图5.4显示的就是新闻信息管理页面,此页面提供给管理员的功能有:根据新闻信息进行新增、修改、查询操作等等。

图5.4 新闻信息管理页面

大家点赞、收藏、关注、评论啦  其他的定制服务  下方联系卡片↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 或者私信作者

猜你喜欢

转载自blog.csdn.net/qq_41221322/article/details/143446590