带展开列表页

表格新增支持展开显示详情(支持同步和异步),通过expanded按钮实现【1.7版本以上,且为容器内支持】
本示例包含了展开的内容配置示例

效果预览

表格主体yml配置

data_table:
  search_bar:
    # 见【框架--检索】组件
  buttons:
    # 见【控件--按钮buttons】组件,数组方式
  header:
    content:
      - {model: checkbox, content: QQ}
      - {model: text, content: QQ}
      - {model: text, content: 头像}
      - {model: text, content: 姓名}
      - {model: text, content: 电话}
  body:
    data: '{%list%}'
    template:
      - {model: checkbox, value: '{%qq%}'}
      - {model: text, value: '{%qq%}'}
      - {model: text, value: '{%qq%}'}
      - {model: text, value: '{%qq%}'}
      - {model: text, value: '{%qq%}'}
      - model: btn_group
        content: 
          - model: btn
            type: expanded # 展开详情的类型为expanded
            icon: fa-expand
            content: '详情'
            expanded_id: expanded_1 # 展开详情的id配置
            params:
              id: '{%id%}'
              name: '{%mobile%}'

详情展开yml配置

preloader:
  # table展开配置
  expanded_1:
    model: expanded
    request: # 如果不配置request,则读取表格按钮传过来的params值,同步展示,如果配置了request,则读取异步接口返回的数据
      model: ajax
      url: "/platform/user/get_info"
      method: 'POST'
      params: 
        id: '{%qq%}'
    body:
      grid:
        - model: row
          cols:
            - model: col
              content: 
                - {model: text, content: 'id: {%city%}'}
            - model: col
              content: 
                - {model: text, content: '创建时间: {%name%}'}
        - model: row
          cols:
            - model: col
              content: 
                - model: form
                  action: '/api/user/save'
                  method: post
                  formenctype: 'multipart/form-data'
                  hide_buttons: true
                  content:
                    - {model: link,label: 超链接,name: wii_link, href: '/edit',value: '{%qq%}', icon: 'fa-info-circle'}
                    - {model: text,icon: 'fa-info-circle',label: 应用状态, content: '{%nickname%}',under_help: 我只是一段提示文字而已}

results matching ""

    No results matching ""