item.vue 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. <template>
  2. <view>
  3. <view class="liwarp" @click="toDetail(item)" v-for="(item,index) in list" :key="index">
  4. <view class="litop">
  5. <view class="li_name">{{item.title}}</view>
  6. <view class="li_status" v-if="item.status == 3">{{i18n['已完成']}}</view>
  7. <view class="li_status" v-else>{{i18n['处理中']}}</view>
  8. </view>
  9. <view class="litext">{{i18n['情况说明']}}:{{item.desc}}</view>
  10. <view class="litime">{{i18n['提交时间']}}:{{item.createtime}}</view>
  11. </view>
  12. <view class="noData" v-if="list.length == 0">{{i18n['暂无更多']}}</view>
  13. </view>
  14. </template>
  15. <script>
  16. export default{
  17. props:{
  18. list:{
  19. type:Array,
  20. default:[]
  21. },
  22. type:{ //已评价 2未评价
  23. type:Number,
  24. default:1
  25. }
  26. },
  27. computed:{
  28. i18n() {
  29. return this.$t("progress")
  30. }
  31. },
  32. data(){
  33. return{
  34. }
  35. },
  36. methods:{
  37. toDetail(item) {
  38. uni.navigateTo({
  39. url:'/pages/evaluate/detail?id='+item.id+'&type='+this.type
  40. })
  41. }
  42. }
  43. }
  44. </script>
  45. <style lang="scss" scoped>
  46. .liwarp{
  47. background:#fff;
  48. border-radius: 20rpx;
  49. box-sizing: border-box;
  50. padding:30rpx;
  51. margin-bottom:24rpx;
  52. .litop{
  53. display: flex;
  54. justify-content: space-between;
  55. align-items: center;
  56. padding-bottom:15rpx;
  57. border-bottom:1rpx solid #EDEDED;
  58. .li_name{
  59. flex:1;
  60. font-size:26rpx;
  61. color:#666666;
  62. margin-right:24rpx;
  63. overflow: hidden;
  64. text-overflow:ellipsis;
  65. white-space: nowrap;
  66. }
  67. .li_status{
  68. flex-shrink: 0;
  69. font-size:22rpx;
  70. color:#65ABF6;
  71. background:rgba(101,171,246,0.3);
  72. padding:8rpx 20rpx;
  73. border-radius: 20rpx;
  74. }
  75. }
  76. .litext{
  77. font-size:24rpx;
  78. color:#999999;
  79. margin:24rpx 0;
  80. }
  81. .litime{
  82. font-size:24rpx;
  83. color:#999999;
  84. }
  85. }
  86. </style>