index.vue 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. <template>
  2. <!-- 产品参数 -->
  3. <base-drawer mode="bottom" :visible="isShow" background-color="transparent" mask maskClosable @close="closeSpecs">
  4. <view class="w-full bg--w111-fff rd-t-40rpx py-32">
  5. <view class="text-center fs-32 text--w111-333 fw-500 mb-34">{{ $t(`参数`) }}</view>
  6. <scroll-view scroll-y="true" class="h-400">
  7. <view class="px-32 scroll-content">
  8. <view class="item flex break_word" v-for="(item, index) in specsInfo" :key="index">
  9. <view class="w-160 text--w111-999 mr-12">{{ item.name }}</view>
  10. <view class="flex-1">{{ item.value }}</view>
  11. </view>
  12. </view>
  13. </scroll-view>
  14. <view class="mx-20 pb-safe">
  15. <view class="mt-52 h-72 flex-center rd-36px bg-color fs-26 text--w111-fff" @click="closeSpecs">{{ $t(`知道了`) }}</view>
  16. </view>
  17. </view>
  18. </base-drawer>
  19. </template>
  20. <script>
  21. import baseDrawer from '@/components/tuiDrawer/tui-drawer.vue';
  22. export default {
  23. props: {
  24. specsInfo: {
  25. type: Array,
  26. default: () => []
  27. }
  28. },
  29. data() {
  30. return {
  31. isShow: false
  32. };
  33. },
  34. components: {
  35. baseDrawer
  36. },
  37. methods: {
  38. closeSpecs() {
  39. this.isShow = false;
  40. }
  41. }
  42. };
  43. </script>
  44. <style scoped lang="scss">
  45. .item ~ .item {
  46. margin-top: 40rpx;
  47. }
  48. </style>