跳转至内容
  • 最新
  • 版块
  • 标签
  • 热门
  • 用户
  • 群组
  • 太微中文教程
  • 新插件投票看板
皮肤
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • 默认(不使用皮肤)
  • 不使用皮肤
折叠
太微中文论坛icon

太微中文论坛

  1. 首页信息流
  2. 版块
  3. 讨论
  4. 分页式查看笔记

分页式查看笔记

已定时 已固定 已锁定 已移动 讨论
5 帖子 2 发布者 46 浏览
  • 从旧到新
  • 从新到旧
  • 最多赞同
登录后回复
此主题已被删除。只有拥有主题管理权限的用户可以查看。
  • 机杼机 离线
    机杼机 离线
    机杼
    编写 最后由 编辑
    #1

    354fd634-f1ae-4777-a643-a957bbb471ec-image.png

    把论坛上的分页式查看笔记拿过来了,做了几个处理。

    • 一个是把原本的固定条目改成了状态条目,这样你可以在多个条目中使用这种模块。
    • 另一个是对没有标签的条目,会显示一个气球的emoij,起到标识的作用。
      • 大多数没有标签的条目可能是临时条目忘了删除,没有被很好地整理下去。
    • 改成了双栏的形式,感觉更美观,空间利用更大。
    • 去除了原本代码中跟着的标签显示。
    • 还排除了没有text的条目。
      • 我是因为自己有很多条目都没有text,而只存储字段值。
    • 自己可以修改里面的筛选器或者排序方式,或者进一步封装成模块,也可以对展示样式进行处理。我本来想自己做一个的,但搞了一下午还是做得不好看。
    • 里面主要使用了rest筛选器,结合limit筛选器,就可以选择条目的范围了。
    • My little pagination routine
    \define additional-select-actions()
    <$set name="rest" filter="[{$:/state/pagination/recent}subtract[12]]">
    <$action-setfield $tiddler="$:/state/pagination/recent" restless=<<rest>> />
    </$set>
    \end
    
    \define build-page(number less)
    <div style="columns: 2;">
    <$list filter="[!is[system]has[text]!sort[created]limit[$number$]rest[$less$]]" >
    • <$link to={{!!title}}>{{!!title}}</$link> <span class='tc-subtitle'><$view format="date" template="YYYY-0MM-0DD" field="created"/>&nbsp;<%if [<currentTiddler>untagged[]] %>🎈<%endif%></span><br />
    </$list>
    </div>
    \end
    
    \define previous-button(interval)
    <$set name='computedText' filter='[{$:/state/pagination/recent}subtract[$interval$]]'>
    <$set name='computedRest' filter='[{$:/state/pagination/recent!!restless}subtract[$interval$]]'>
    <$action-setfield $tiddler='$:/state/pagination/recent' text=<<computedText>> restless=<<computedRest>> />
    </$set>
    </$set>
    Previous
    \end
    
    \define next-button(interval)
    <$set name='computedText' filter='[{$:/state/pagination/recent}add[$interval$]]'>
    <$set name='computedRest' filter='[{$:/state/pagination/recent!!restless}add[$interval$]]'>
    <$action-setfield $tiddler='$:/state/pagination/recent' text=<<computedText>> restless=<<computedRest>> />
    </$set>
    </$set>
    Next
    \end
    
    <div class="tc-subtitle">Recent</div>
    
    <$macrocall $name="build-page" number={{$:/state/pagination/recent}} less={{$:/state/pagination/recent!!restless}} />
    
    <div class='spacerhalf'></div>
    
    <$set name='totaltidds' filter='[!is[system]has[text]count[]]'>
    <$set name='tiddspan' filter='[{$:/state/pagination/recent}subtract[11]]'>
    <$list filter="[field:title[$:/state/pagination/recent]!text[12]]">
    <$button>
    <<previous-button 12>>
    </$button>
    </$list>
    
    <$set name='pages' filter='[!is[system]has[text]count[]divide[12]round[]]'>
    <$set name=start value="1">
    <$set name=end value=<<pages>>>
    <$select tiddler='$:/state/pagination/recent' actions=<<additional-select-actions>>>
    <$list filter="[range<start>,<end>]" variable=index>
    <$set name=multipliedvalue filter="[<index>multiply[12]]">
    <$set name=multipliedrest filter="[<index>multiply[12]subtract[12]]">
    <option value=<<multipliedvalue>>><<index>></option>
    </$set>
    </$set>
    </$list>
    </$select>
    </$set>
    </$set>
    
    <$list filter="[field:title[$:/state/pagination/recent]get[text]compare:number:lt<totaltidds>]">
    <$button>
    <<next-button 12>>
    </$button>
    </$list>
    
    <div class='spacerhalf'></div>
    
    <div>Viewing: <<tiddspan>>-{{$:/state/pagination/recent}} of <<totaltidds>></div>
    </$set>
    </$set>
    
    
    1 条回复 最后回复
    0
    • 机杼机 离线
      机杼机 离线
      机杼
      编写 最后由 编辑
      #2

      @linonetwo 论坛中的代码区块没有换行功能吗?感觉没有换行看起来不太方便的样子。

      1 条回复 最后回复
      0
      • 机杼机 离线
        机杼机 离线
        机杼
        编写 最后由 编辑
        #3

        这是两三年前用define形式写的宏,现在已经不推荐这种写法了,但直接替换怕出问题,还是以后再改吧。目前也能够正常使用。可以增加一个侧边栏标签以显示在侧边栏中。

        1 条回复 最后回复
        0
        • linonetwoL 离线
          linonetwoL 离线
          linonetwo
          编写 最后由 编辑
          #4

          上面的代码块看起来有正确换行呀。

          还有分页我现在基本都用高维表格插件了,它就不需要分页,把几十万行直接显示在一起都没关系,因为是基于 canvas 的。然后就用搜索来快速抵达很底下的位置

          图片.png

          机杼机 1 条回复 最后回复
          1
          • 机杼机 离线
            机杼机 离线
            机杼
            回复了linonetwo 最后由 编辑
            #5

            @linonetwo 我说的换行是那种代码块超过屏幕范围后的自动换行。我感觉那样会更方便查看,不然还需要滚动鼠标去查看完整的代码。

            1 条回复 最后回复
            0

            • 登录

            • 没有帐号? 注册

            • 登录或注册以进行搜索。
            Powered by NodeBB Contributors
            • 第一个帖子
              最后一个帖子
            0
            • 最新
            • 版块
            • 标签
            • 热门
            • 用户
            • 群组
            • 太微中文教程
            • 新插件投票看板