index.axml 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144
  1. <view
  2. a:key="ant-rare-words-input-{{ $id }}"
  3. style="{{ style }}"
  4. class="ant-rare-words-keyboard {{ className || '' }}">
  5. <view
  6. a:if="{{ visible }}"
  7. class="ant-rare-words-keyboard-modal {{ showMask ? '' : 'hide' }}"
  8. onTap="handleHide"
  9. onAppear="catchAppearModal" />
  10. <view class="ant-rare-words-keyboard-kb {{ visible ? '' : 'hide' }}">
  11. <view class="ant-rare-words-keyboard-header">
  12. <view
  13. a:if="{{ type !== 'handwriting' }}"
  14. class="ant-rare-words-keyboard-input_value {{ displayStr.length > 0 && visible ? '' : 'hide' }}">
  15. {{ displayStr }}
  16. </view>
  17. <view class="ant-rare-words-keyboard-match_words_wrap">
  18. <view
  19. class="ant-rare-words-keyboard-match_words {{ showMoreWords ? 'absolute' : '' }}">
  20. <view
  21. class="ant-rare-words-keyboard-match_words_inner {{ showMoreWords ? 'all' : '' }}">
  22. <view
  23. a:if="{{ matchWordsList.length === 0 }}"
  24. class="ant-rare-words-keyboard-match_words_hidden">
  25. </view>
  26. <block
  27. a:for="{{ matchWordsList }}"
  28. a:for-index="index"
  29. a:for-item="item">
  30. <view
  31. class="ant-rare-words-keyboard-match_words_item {{ showMoreWords ? 'all' : '' }}"
  32. data-value="{{ item.unicodeChar }}"
  33. onTap="handleWordClick">
  34. <view class="ant-rare-words-keyboard-match_words_item_text">
  35. {{ item.unicodeChar }}
  36. </view>
  37. </view>
  38. </block>
  39. <view
  40. a:if="{{ loading }}"
  41. class="ant-rare-words-keyboard-match_words_item_tips loading">
  42. <loading
  43. className="ant-rare-words-keyboard-loading"
  44. type="mini"
  45. size="small"
  46. color="#666666" />
  47. <!-- display: inline -->
  48. <text>加载中</text>
  49. </view>
  50. <view
  51. a:else
  52. class="ant-rare-words-keyboard-match_words_item_tips">
  53. <!-- display: inline -->
  54. <text
  55. a:if="{{ !!(displayStr === '' && matchWordsList.length === 0) }}"
  56. >请输入生僻字对应的拼音</text
  57. >
  58. <!-- display: inline -->
  59. <text
  60. a:if="{{ !!(displayStr !== '' && matchWordsList.length === 0) }}"
  61. >更多生僻字完善中,敬请期待</text
  62. >
  63. </view>
  64. </view>
  65. <view
  66. class="ant-rare-words-keyboard-match_words_right {{ showMoreWords ? 'sticky' : '' }} {{ matchWordsList.length > maxDisplayNum && !showMoreWords ? 'overflow' : '' }}"
  67. onTap="hanleLookMore">
  68. <icon
  69. className="ant-rare-words-keyboard_down"
  70. type="DownOutline" />
  71. </view>
  72. </view>
  73. </view>
  74. <view class="ant-rare-words-keyboard_main">
  75. <view a:if="{{ showErrorPage }}">
  76. <slot name="resultError">
  77. <view class="ant-rare-words-keyboard_error">
  78. <result
  79. className="ant-rare-words-keyboard_error-result"
  80. image="https://mdn.alipayobjects.com/huamei_2fq7mt/afts/img/A*VtvFS4EJl0cAAAAAAAAAAAAADh58AQ/original"
  81. message="页面遇到一些小问题">
  82. <view
  83. slot="extra"
  84. class="ant-rare-words-keyboard_error-btns">
  85. <button
  86. type="primary"
  87. size="small"
  88. inline
  89. onTap="handleRetry">
  90. 重试
  91. </button>
  92. </view>
  93. </result>
  94. </view>
  95. </slot>
  96. </view>
  97. <view
  98. a:else
  99. class="ant-rare-words-keyboard_pinyin">
  100. <block
  101. a:for="{{ pinyinMaps }}"
  102. a:for-index="mapIndex"
  103. a:for-item="mapItem"
  104. a:key="{{ mapIndex }}">
  105. <view class="ant-rare-words-keyboard_pinyin_row">
  106. <block
  107. a:for="{{ mapItem }}"
  108. a:for-index="index"
  109. a:for-item="item"
  110. a:key="{{ item.value }}">
  111. <view
  112. data-value="{{ item.value }}"
  113. class="ant-rare-words-keyboard_pinyin_key {{ showMoreWords ? 'all' : '' }}"
  114. onTap="handleKeyClick">
  115. <view class="ant-rare-words-keyboard_pinyin_key_text">
  116. {{ item.label }}
  117. </view>
  118. </view>
  119. </block>
  120. <view
  121. a:if="{{ mapIndex === pinyinMaps.length - 1 }}"
  122. class="ant-rare-words-keyboard_pinyin_key delete"
  123. onTap="handleDelete">
  124. <view class="ant-rare-words-keyboard_pinyin_key_text">
  125. <icon
  126. className="ant-rare-words-keyboard_delete"
  127. type="TextDeletionOutline" />
  128. </view>
  129. </view>
  130. </view>
  131. </block>
  132. </view>
  133. </view>
  134. </view>
  135. <view
  136. a:if="{{ safeArea }}"
  137. class="ant-rare-words-keyboard-kb_iphonex-safe" />
  138. </view>
  139. </view>