页面
页面代码
<% layout('/layouts/default.html', {title: '故事管理', libs: ['dataGrid']}){ %>
<div class="main-content">
<div class="box box-main">
<div class="box-header">
<div class="box-title">
<i class="fa icon-notebook"></i> ${text('故事管理')}
</div>
<div class="box-tools pull-right">
<a href="#" class="btn btn-default" id="btnSearch" title="${text('查询')}"><i class="fa fa-filter"></i> ${text('查询')}</a>
<% if(hasPermi('story:story:edit')){ %>
<a href="${ctx}/story/story/form" class="btn btn-default btnTool" title="${text('新增故事')}"><i class="fa fa-plus"></i> ${text('新增')}</a>
<% } %>
<a href="#" class="btn btn-default" id="btnSetting" title="${text('设置')}"><i class="fa fa-navicon"></i></a>
</div>
</div>
<div class="box-body">
<#form:form id="searchForm" model="${story}" action="${ctx}/story/story/listData" method="post" class="form-inline hide"
data-page-no="${parameter.pageNo}" data-page-size="${parameter.pageSize}" data-order-by="${parameter.orderBy}">
<div class="form-group">
<label class="control-label">${text('以前的故事')}:</label>
<div class="control-inline">
<#form:input path="oldStory" class="form-control width-120"/>
</div>
</div>
<div class="form-group">
<label class="control-label">${text('应用在如今')}:</label>
<div class="control-inline">
<#form:input path="newStory" class="form-control width-120"/>
</div>
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary btn-sm"><i class="glyphicon glyphicon-search"></i> ${text('查询')}</button>
<button type="reset" class="btn btn-default btn-sm isQuick"><i class="glyphicon glyphicon-repeat"></i> ${text('重置')}</button>
</div>
</#form:form>
<table id="dataGrid"></table>
<div id="dataGridPage"></div>
</div>
</div>
</div>
<% } %>
<script>
$('#dataGrid').dataGrid({
searchForm: $('#searchForm'),
columnModel: [
{header:'${text("以前的故事")}', name:'oldStory', index:'a.old_story', width:150, align:"left", frozen:true, formatter: function(val, obj, row, act){
return '<a href="${ctx}/story/story/form?storyId='+row.storyId+'" class="btnList" data-title="${text("编辑故事")}">'+(val||row.id)+'</a>';
}},
{header:'${text("应用在如今")}', name:'newStory', index:'a.new_story', width:150, align:"left"},
{header:'${text("操作")}', name:'actions', width:120, formatter: function(val, obj, row, act){
var actions = [];
actions.push('<a href="${ctx}/story/story/form?storyId='+row.storyId+'" class="btnList" title="${text("编辑故事")}"><i class="fa fa-pencil"></i></a> ');
actions.push('<a href="${ctx}/story/story/delete?storyId='+row.storyId+'" class="btnList" title="${text("删除故事")}" data-confirm="${text("确认要删除该故事吗?")}"><i class="fa fa-trash-o"></i></a> ');
return actions.join('');
}}
],
ajaxSuccess: function(data){
}
});
</script>
数据库表
CREATE TABLE `story` (
`story_id` varchar(100) NOT NULL COMMENT '故事编号',
`old_story` text COMMENT '以前的故事',
`new_story` text COMMENT '应用在如今',
PRIMARY KEY (`story_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_0900_ai_ci COMMENT='故事';
INSERT INTO `story` VALUES ('1','狮子想吃掉它的三个大臣,于是想出来一个骗局好吃掉它们。它张开大口,叫兔子来闻闻它的嘴里有什么味道。兔子答道:“大王,非常抱歉!我最近患了伤风,鼻子不通气,现在什么味道也闻不到了。大王您如果能让我回家休息几天,等我的伤风好了,一定会为您效劳。”故事中,兔子采用了拖延策略。','饭局上,领导让属下喝酒,属下答道:“领导,非常抱歉!我开车过来的,下次再陪您喝酒。”'),
('2','唐代著名诗人李涉途经九江遭到了强盗拦路抢劫,他口吟一首七绝:暮雨潇潇江上村,绿林豪客夜知闻。他时不用逃名姓,世上如今半是君。那些强盗听后大悦,于是对李涉以礼相待。这个故事告诉我们要会吹捧强者。','下属和领导打乒乓球你赢了,领导说道:“看来我真的老喽,不中用了。”下属答道:“我虽然在乒乓球领域胜了您,但领导您在我们行业里却是冠军。”'),
('3','有一只蝙蝠冒失地闯入了黄鼠狼的家里,黄鼠狼说它是老鼠,要吃了它。蝙蝠哭诉:“我有一双会飞的翅膀,我可不是老鼠。”过了两天,蝙蝠又撞进另一只黄鼠狼的家中,黄鼠狼夫人说它是小鸟,又要吃了它,蝙蝠再次辩解:“鸟是有羽毛的动物,你看看我,浑身上下没有一根毛,其实我是一只老鼠。”这个故事告诉我们,要灵活改变自己的立场。','婆婆和媳妇闹矛盾了,对婆婆说:“我是您儿子,当然站在您这一边。”对媳妇说:“我是你的丈夫,不向着你还能向着谁。”');