data.ts 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206
  1. export interface ListItem {
  2. id: string;
  3. avatar: string;
  4. // 通知的标题内容
  5. title: string;
  6. // 是否在标题上显示删除线
  7. titleDelete?: boolean;
  8. datetime: string;
  9. type: string;
  10. read?: boolean;
  11. description: string;
  12. clickClose?: boolean;
  13. extra?: string;
  14. color?: string;
  15. // 优先级
  16. priority?: string;
  17. }
  18. export enum PriorityTypes {
  19. // 低优先级,一般消息
  20. L = 'L',
  21. // 中优先级,重要消息
  22. M = 'M',
  23. // 高优先级,紧急消息
  24. H = 'H',
  25. }
  26. export interface TabItem {
  27. key: string;
  28. name: string;
  29. list: ListItem[];
  30. unreadlist?: ListItem[];
  31. count: number;
  32. }
  33. export const tabListData: TabItem[] = [
  34. {
  35. key: '1',
  36. name: '通知',
  37. list: [
  38. {
  39. id: '000000001',
  40. avatar: 'https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png',
  41. title: '你收到了 14 份新周报',
  42. description: '',
  43. datetime: '2017-08-09',
  44. type: '1',
  45. },
  46. {
  47. id: '000000002',
  48. avatar: 'https://gw.alipayobjects.com/zos/rmsportal/OKJXDXrmkNshAMvwtvhu.png',
  49. title: '你推荐的 曲妮妮 已通过第三轮面试',
  50. description: '',
  51. datetime: '2017-08-08',
  52. type: '1',
  53. },
  54. {
  55. id: '000000003',
  56. avatar: 'https://gw.alipayobjects.com/zos/rmsportal/kISTdvpyTAhtGxpovNWd.png',
  57. title: '这种模板可以区分多种通知类型',
  58. description: '',
  59. datetime: '2017-08-07',
  60. // read: true,
  61. type: '1',
  62. },
  63. {
  64. id: '000000004',
  65. avatar: 'https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png',
  66. title: '左侧图标用于区分不同的类型',
  67. description: '',
  68. datetime: '2017-08-07',
  69. type: '1',
  70. },
  71. {
  72. id: '000000005',
  73. avatar: 'https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png',
  74. title: '标题可以设置自动显示省略号,本例中标题行数已设为1行,如果内容超过1行将自动截断并支持tooltip显示完整标题。',
  75. description: '',
  76. datetime: '2017-08-07',
  77. type: '1',
  78. },
  79. {
  80. id: '000000006',
  81. avatar: 'https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png',
  82. title: '左侧图标用于区分不同的类型',
  83. description: '',
  84. datetime: '2017-08-07',
  85. type: '1',
  86. },
  87. {
  88. id: '000000007',
  89. avatar: 'https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png',
  90. title: '左侧图标用于区分不同的类型',
  91. description: '',
  92. datetime: '2017-08-07',
  93. type: '1',
  94. },
  95. {
  96. id: '000000008',
  97. avatar: 'https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png',
  98. title: '左侧图标用于区分不同的类型',
  99. description: '',
  100. datetime: '2017-08-07',
  101. type: '1',
  102. },
  103. {
  104. id: '000000009',
  105. avatar: 'https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png',
  106. title: '左侧图标用于区分不同的类型',
  107. description: '',
  108. datetime: '2017-08-07',
  109. type: '1',
  110. },
  111. {
  112. id: '000000010',
  113. avatar: 'https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png',
  114. title: '左侧图标用于区分不同的类型',
  115. description: '',
  116. datetime: '2017-08-07',
  117. type: '1',
  118. },
  119. ],
  120. count: 0,
  121. },
  122. {
  123. key: '2',
  124. name: '系统消息',
  125. list: [
  126. {
  127. id: '000000006',
  128. avatar: 'https://gw.alipayobjects.com/zos/rmsportal/fcHMVNCjPOsbUGdEduuv.jpeg',
  129. title: '曲丽丽 评论了你',
  130. description: '描述信息描述信息描述信息',
  131. datetime: '2017-08-07',
  132. type: '2',
  133. clickClose: true,
  134. },
  135. {
  136. id: '000000007',
  137. avatar: 'https://gw.alipayobjects.com/zos/rmsportal/fcHMVNCjPOsbUGdEduuv.jpeg',
  138. title: '朱偏右 回复了你',
  139. description: '这种模板用于提醒谁与你发生了互动',
  140. datetime: '2017-08-07',
  141. type: '2',
  142. clickClose: true,
  143. },
  144. {
  145. id: '000000008',
  146. avatar: 'https://gw.alipayobjects.com/zos/rmsportal/fcHMVNCjPOsbUGdEduuv.jpeg',
  147. title: '标题',
  148. description:
  149. '请将鼠标移动到此处,以便测试超长的消息在此处将如何处理。本例中设置的描述最大行数为2,超过2行的描述内容将被省略并且可以通过tooltip查看完整内容',
  150. datetime: '2017-08-07',
  151. type: '2',
  152. clickClose: true,
  153. },
  154. ],
  155. count: 0,
  156. },
  157. // {
  158. // key: '3',
  159. // name: '待办',
  160. // list: [
  161. // {
  162. // id: '000000009',
  163. // avatar: '',
  164. // title: '任务名称',
  165. // description: '任务需要在 2017-01-12 20:00 前启动',
  166. // datetime: '',
  167. // extra: '未开始',
  168. // color: '',
  169. // type: '3',
  170. // },
  171. // {
  172. // id: '000000010',
  173. // avatar: '',
  174. // title: '第三方紧急代码变更',
  175. // description: '冠霖 需在 2017-01-07 前完成代码变更任务',
  176. // datetime: '',
  177. // extra: '马上到期',
  178. // color: 'red',
  179. // type: '3',
  180. // },
  181. // {
  182. // id: '000000011',
  183. // avatar: '',
  184. // title: '信息安全考试',
  185. // description: '指派竹尔于 2017-01-09 前完成更新并发布',
  186. // datetime: '',
  187. // extra: '已耗时 8 天',
  188. // color: 'gold',
  189. // type: '3',
  190. // },
  191. // {
  192. // id: '000000012',
  193. // avatar: '',
  194. // title: 'ABCD 版本发布',
  195. // description: '指派竹尔于 2017-01-09 前完成更新并发布',
  196. // datetime: '',
  197. // extra: '进行中',
  198. // color: 'blue',
  199. // type: '3',
  200. // },
  201. // ],
  202. // },
  203. ];