TTMS开发初体验之小demo

最新推荐文章于 2023-07-16 22:45:44 发布

ANG-X

最新推荐文章于 2023-07-16 22:45:44 发布

阅读量435

点赞数 2

文章标签： ttms

本文链接：https://blog.csdn.net/qq_42070179/article/details/92799340

版权

这篇博客分享了作者在TTMS系统中开发小demo的体验，详细介绍了从前端总页面(index.jsp)、js文件到后台的domain、daoImpl、service、serviceImpl以及servlet的实现过程。

摘要由CSDN通过智能技术生成

开发小demo

1.前端总页面(index.jsp)

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>

<head>
    <title>有点大雪影院管理系统</title>
    <meta content="text/html" charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="themes/bootstrap/easyui.css">
    <link rel="stylesheet" type="text/css" href="themes/icon.css">
    <link rel="stylesheet" type="text/css" href="themes/color.css">
    <link rel="stylesheet" type="text/css" href="themes/local_css/index.css">
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="locale/easyui-lang-zh_CN.js"></script>
</head>

<body class="easyui-layout">
<div data-options="region:'north',hideCollapsedContent:false, title:'<center>有点大雪影院管理系统</center>', border:false, " style="height:100px;">
    <div id="m_top" style="display:inline-block;padding-top: 8px">
        <span style="text-align: center;color:royalblue;margin-left: 400px;">
            <img src="themes/icons/kodinger_logo.png" alt="有点大雪影院管理系统" style="width: 50px; height: 50px;">
            <span style="font-size: 33px;">欢迎来到有点大雪影院管理系统</span>
            <span style="font-size: 20px; margin-left: 400px;">
                欢迎您，${u.u_name}!
                <a href="logout">注销</a>
            </span>
        </span>

    </div>
</div>
<div data-options="region:'south',hideCollapsedContent:false,collapsed:true,title:'版权信息',border:'false',split:true" style="height:70px;">
    <div id="belongs" style=" font-family: 'Lucida Sans'; text-align: center;">
        <p>Copyright &copy; 2019.5.15 XQRJ</p>
    </div>
</div>
<div data-options="region:'east',split:true,hideCollapsedContent:false,collapsed:true,title:'系统通知'"
     style="width:100px;"></div>
<div id="west_menu" data-options="region:'west',hideCollapsedContent:false,collapsed:false,title:'菜单',split:true" style="width:180px;">
        <div class="easyui-accordion" data-options="fit:true,border:false" style="width:248px; height: 80px">

            <div title="管理剧目" data-options="iconCls:'icon-film'" style="overflow:auto;padding:10px;">
                <ul data-options="iconCls:'icon-staff'" >
                    <li><a href="#" title="剧目管理" onclick="addTab('剧目管理','m_film.jsp')">剧目管理</a></li>
             
                </ul>
            </div>
         </div>
</div>
<div data-options="region:'center',title:'center title'" style="padding:5px;background:#eee;">
    <div id="tt" class="easyui-tabs" data-options="fit:true">
        <div title="系统欢迎页面" style="padding:10px;">
            欢迎来到 <span style="font-size: 23px;">有点大雪影院</span><br>
        </div>
    </div>
</div>

<%--自定义js,用于页面处理--%>
<script type="text/javascript" src="/js/local_js/index.js"></script>

</body>
</html>

2.总页面js文件(index.js)

$(function () {
   
    $("a[title]").click(function () {
   
        var text = $(this).text();
        var href = $(this).attr("title");
        //判断当前右边是否已有相应的tab
        if ($("#tt").tabs("exists", text)) {
   
            $("#tt").tabs("select", text);
        } else {
   
            //如果没有则创建一个新的tab，否则切换到当前tag
            $("#tt").tabs("add", {
   
                title: text,
                closable: true,
                content: '<iframe title=' + text + 'src=' + href + ' frameborder="0" width="100%" height="100%" />'
                //href:默认通过url地址加载远程的页面，但是仅仅是body部分
                //href:'send_category_query.action'
            });
        }

    });
});

function addTab(title, url) {
   
    if ($('#tt').tabs('exists', title)) {
   
        $('#tt').tabs('select', title);
    } else {
   
        var content = '<iframe scrolling="auto" frameborder="0"  src="' + url + '" style="width:100%;height:100%;"></iframe>';
        $('#tt').tabs('add', {
   
            title: title,
            content: content,
            closable: true
        });
    }
}

3.分页面之一（m_film.jsp）

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>M_FILM</title>
    <link rel="stylesheet" type="text/css" href="themes/bootstrap/easyui.css">
    <link rel="stylesheet" type="text/css" href="themes/icon.css">
    <link rel="stylesheet" type="text/css" href="themes/color.css">
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="locale/easyui-lang-zh_CN.js"></script>
</head>
<body>
<div id="c1">
    <table id="m_film" class="easyui-datagrid" style="width: 100%;height:600px;" data-options="
                            title:'剧目管理',
                            iconCls: 'icon-film',
                            url: 'search_all_plays',
                            method: 'get',
                            pagination:true,
                            toolbar: '#c1_tool'
                        ">
    </table>
    <div id="c1_tool" style="padding: 5px;">
        <a id="n1" href

最低0.47元/天解锁文章

ANG-X

关注

2
点赞
踩
5

收藏

觉得还不错? 一键收藏
0
评论
TTMS开发初体验之小demo

开发小demo1.前端总页面(index.jsp)<%@ page contentType="text/html;charset=UTF-8" language="java" %><%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %><html><head> ...
复制链接

扫一扫

专栏目录