index.vue 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112
  1. <template>
  2. <div class="aboutThePark">
  3. <div class="whiteBoard">
  4. <img :src="briefImg.url" class="testImg">
  5. <div class="info" v-html="form.content">
  6. </div>
  7. </div>
  8. <div class="whiteBoard">
  9. <div class="detailLi">
  10. <span class="liName">
  11. <span class="callName">招商电话:</span>
  12. <span class="callNumber">{{ form.attractPhone }}</span>
  13. </span>
  14. <img src="https://www.idea-co-sf.com/gardenProduct/image/phoneIcon.png" class="phoneIcon" @tap="call">
  15. </div>
  16. </div>
  17. </div>
  18. </template>
  19. <script>
  20. import { getByGroupId } from "../../../js_sdk/http";
  21. export default {
  22. name: "index",
  23. data(){
  24. return{
  25. briefImg: [],
  26. form:{
  27. }
  28. }
  29. },
  30. mounted(){
  31. this.getById()
  32. },
  33. onLoad(options){
  34. },
  35. methods:{
  36. getById(){
  37. const data = {
  38. groupId : JSON.parse(uni.getStorageSync('selectGroup')).groupId
  39. }
  40. getByGroupId(data).then((res)=>{
  41. this.form = res
  42. this.briefImg = JSON.parse(res.briefImg)
  43. })
  44. },
  45. call(){
  46. uni.makePhoneCall({
  47. phoneNumber: this.form.attractPhone, // 电话号码
  48. success: function () {
  49. console.log('拨打电话成功');
  50. },
  51. fail: function () {
  52. console.log('拨打电话失败');
  53. }
  54. });
  55. }
  56. }
  57. }
  58. </script>
  59. <style lang="scss">
  60. .aboutThePark{
  61. .whiteBoard{
  62. background: white;
  63. margin: 24rpx 0;
  64. padding: 24rpx;
  65. .testImg{
  66. width: 686rpx;
  67. height: 300rpx;
  68. }
  69. .info{
  70. color: #333333;
  71. font-size: 28rpx;
  72. line-height: 42rpx;
  73. margin: 24rpx 0;
  74. word-wrap: break-word;
  75. }
  76. .detailLi{
  77. display: flex;
  78. justify-content: space-between;
  79. align-items: center;
  80. .liInfo{
  81. display: inline-block;
  82. text-align: right;
  83. max-width: 428rpx;
  84. color: rgba(102, 102, 102, 1);
  85. font-size: 32rpx;
  86. line-height: 38rpx;
  87. overflow: hidden;
  88. word-wrap: break-word;
  89. }
  90. .callNumber{
  91. color: rgba(24, 23, 42, 1);
  92. font-size: 36rpx;
  93. font-weight: 600;
  94. }
  95. .callName{
  96. color: rgba(102, 102, 102, 1);
  97. font-size: 28rpx;
  98. }
  99. .phoneIcon{
  100. width: 64rpx;
  101. height: 64rpx;
  102. }
  103. }
  104. }
  105. }
  106. </style>