index.vue 2.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. <template>
  2. <div class="todoIndex">
  3. <div class="todoItem" v-for="item in todoList" @tap.stop="toDetail(item)">
  4. <div class="tagTip">{{ item.tag }}</div>
  5. <div class="todoItemTitle">{{ item.name }}</div>
  6. <div class="submitTime">提交时间:2024-05-21</div>
  7. <div class="submitPerson">提交人:吴凯旋</div>
  8. </div>
  9. </div>
  10. </template>
  11. <script>
  12. export default {
  13. components: {
  14. },
  15. data() {
  16. return {
  17. todoList:[
  18. {name:'2024年01月26日~2024年...',tag:'企业房源预定'},
  19. {name:'空调坏了,不能使用',tag:'报事报修-派单'},
  20. {name:'上月水费不太对,怀疑水表',tag:'报事报修-处理'},
  21. {name:'XXXXXXX企业入库审核',tag:'企业入库审核'},
  22. {name:'2024年01月26日~2024年...',tag:'企业房源预定'},
  23. ]
  24. };
  25. },
  26. methods:{
  27. toDetail(item) {
  28. if(item.tag === '企业房源预定'){
  29. uni.navigateTo({
  30. url:'/pages/subPackages/todo/predetermineDetail'
  31. })
  32. }else if(item.tag.includes('报事报修')){
  33. uni.navigateTo({
  34. url:'/pages/subPackages/todo/repairAcceptance'
  35. })
  36. }
  37. }
  38. }
  39. }
  40. </script>
  41. <style lang="scss">
  42. .todoIndex{
  43. .todoItem{
  44. margin-top: 24rpx;
  45. width: 686rpx;
  46. height: 212rpx;
  47. padding: 32rpx 32rpx;
  48. position: relative;
  49. background: white;
  50. border-radius: 16rpx;
  51. box-sizing: border-box;
  52. margin-left: 32rpx;
  53. .tagTip{
  54. position: absolute;
  55. right: 0;
  56. top: 0;
  57. width: 220rpx;
  58. height: 56rpx;
  59. color: rgba(3, 101, 249, 1);
  60. font-size: 26rpx;
  61. display: flex;
  62. align-items: center;
  63. justify-content: center;
  64. background: url("https://www.idea-co-sf.com/gardenProduct/image/bj02.png") no-repeat;
  65. background-size: 100%;
  66. }
  67. .todoItemTitle{
  68. width: 400rpx;
  69. overflow: hidden;
  70. white-space: nowrap;
  71. text-overflow: ellipsis;
  72. color: rgba(34, 34, 34, 1);
  73. font-size: 32rpx;
  74. line-height: 38rpx;
  75. font-weight: 600;
  76. }
  77. .submitTime{
  78. color: rgba(102, 102, 102, 1);
  79. font-size: 28rpx;
  80. margin-top: 24rpx;
  81. line-height: 32rpx;
  82. }
  83. .submitPerson{
  84. color: rgba(102, 102, 102, 1);
  85. font-size: 28rpx;
  86. margin-top: 16rpx;
  87. line-height: 32rpx;
  88. }
  89. }
  90. }
  91. </style>