app-copyright.vue 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. <template>
  2. <view class="app-view">
  3. <app-jump-button form :url="link.url" :open_type="link.openType" :params="link.params?link.params:[]">
  4. <view class="app-view dir-top-nowrap cross-center" :style="{backgroundColor: backgroundColor}">
  5. <icon class="app-icon" v-if="picUrl" :style="{backgroundImage: `url(${picUrl})`}"></icon>
  6. <text class="app-text" :style="{marginTop: picUrl ? '16rpx': '24rpx'}">{{text}}</text>
  7. </view>
  8. </app-jump-button>
  9. </view>
  10. </template>
  11. <script>
  12. import appJumpButton from '../../basic-component/app-jump-button/app-jump-button.vue';
  13. export default {
  14. name: 'app-copyright',
  15. components: {
  16. 'app-jump-button': appJumpButton,
  17. },
  18. props: {
  19. backgroundColor: {
  20. type: String,
  21. default() {
  22. return '#ff4544';
  23. }
  24. },
  25. link: {
  26. type: Object,
  27. default() {
  28. return null;
  29. }
  30. },
  31. picUrl: String,
  32. text: String,
  33. }
  34. }
  35. </script>
  36. <style scoped lang="scss">
  37. .app-view {
  38. width: #{750rpx};
  39. border: none;
  40. border-radius: 0;padding-bottom: 24rpx;
  41. }
  42. .app-text {
  43. font-size: #{24rpx};
  44. text-align: center;
  45. color: #999999;
  46. }
  47. .app-icon {
  48. width: #{160rpx};
  49. height: #{50rpx};
  50. margin-top: #{36rpx};
  51. background-size: 100% 100%;
  52. background-repeat: no-repeat;
  53. }
  54. </style>