MergeMessageRender.vue 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. <template>
  2. <view @click="toPreview" class="merge_message_container">
  3. <view class="merge_title">
  4. <text>{{ title }}</text>
  5. </view>
  6. <view class="merge_desc">
  7. <text v-for="(item, idx) in message.mergeElem.abstractList" v-if="idx < 4" :key="idx" class="merge_item">
  8. {{ item }}
  9. </text>
  10. </view>
  11. </view>
  12. </template>
  13. <script>
  14. export default {
  15. name: 'CardMessageRender',
  16. components: {},
  17. props: {
  18. message: Object
  19. },
  20. data() {
  21. return {};
  22. },
  23. computed: {
  24. title() {
  25. // const sessionType = this.message.mergeElem.multiMessage[0].sessionType;
  26. // if (sessionType === 1) {
  27. // return this.message.mergeElem.title;
  28. // }
  29. return this.message.mergeElem.title;
  30. }
  31. },
  32. methods: {
  33. toPreview() {
  34. console.log("qxj mergeElem:");
  35. console.log(this.message.mergeElem);
  36. uni.$u.route('/pages_im/pages/conversation/previewMerge/index', {
  37. mergeData: encodeURIComponent(JSON.stringify(this.message.mergeElem))
  38. });
  39. }
  40. }
  41. };
  42. </script>
  43. <style lang="scss" scoped>
  44. .merge_message_container {
  45. padding: 0 !important;
  46. width: 444rpx;
  47. box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
  48. border-radius: 12rpx;
  49. border: 1px solid #ececec;
  50. background: #fff;
  51. .merge_title {
  52. padding: 12rpx 24rpx;
  53. border-bottom: 1px solid #ececec;
  54. text {
  55. @include ellipsisWithLine(1);
  56. }
  57. }
  58. .merge_desc {
  59. @include colBox(false);
  60. padding: 12rpx 24rpx;
  61. font-size: 24rpx;
  62. color: #666;
  63. .merge_item {
  64. @include ellipsisWithLine(3);
  65. padding: 4rpx 0;
  66. }
  67. }
  68. }
  69. </style>