大道至简,新一代企业应用无栈开发

平台之上,一种语言,可视化、脚本化、全端一体化开发

组件化搜索结果

开发支持搜索、过滤、分页的搜索页面

理解搜索页面

搜索页面通常包括如下内容,分散在页面主区域和侧边:

  • 快速搜索区域

    对任何文字进行快速搜索

  • 可选:高级搜索区域

    可以组合多个条件

  • 筛选区域

    多组分类条件

  • 结果渲染区域,包括:

    - 搜索结果表格
    - 排序控制
    - 分页控制
    

渲染搜索页面

FORM_ID = 'xxxx'  # 主搜索表单的id
RENDER_SCRIPT = 'xxx.xxx:render_query'  # 搜索结果的渲染脚本
RESULT_ID = 'xxxxxx' # 输出的位置ID

# 渲染初始的内容
print root.call_script(RENDER_SCRIPT, 
    context=context, request=request, view=view, init=Ture,
    form_id=FORM_ID, 
    result_id=RESULT_ID, 
    ...)

return printed

搜索结果渲染脚本 RENDER_SCRIPT

参数就是form传入的参数:

stati, query_json, form_id, result_id, init=False

脚本正文:

# 搜索
qs = QuserSet()
if stati:
    qs.anyof(stati=[stati])

# 核心表单,提交之后刷新
form = ui.form(id=FORM_ID)\
    .on('submit', context, request, RENDER_SCRIPT, result_id=RESULT_ID)

# 加应该筛选字段,绑定到表单
print ui.nav_select(name="stati", form=FORM_ID, ....)


# 渲染
grid = ui.grid(0, 4)
for index, obj in enumerate(qs):
    grid.set(index, 0, obj.name)
    ...

# 分页, 点击之后提交到form
result = form + grid + ui.pagenation(... name='batch', form=form_id)

if init:
    return ui.layout(id=result_id)\
        .add(result)
else:
    view.select("#" + result_id).set_content(result)

加入新的搜索条件

外部搜索字段可通过添加一个hidden input附件搜索条件,格式如下::

   ui.hidden_input(name="query_json", value=query_json, form=FORM_ID)

其中query_json为通过json.dumps()处理后的搜索条件

当然RENDER_SCRIPT里面应该增加query_json搜索条件的处理:

if query_json:
    query_json.loads(query_json)
    qs.query_json(query_json)