index.vue 1.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. <template>
  2. <view class="component-wrapper u000242" :style="wrapper_style">
  3. <video :poster="video_url.isShowPoster == '0' ? '' : video_url.poster" style="width: 100%;"
  4. :src="video_url.video_url" controls="controls">
  5. </video>
  6. </view>
  7. </template>
  8. <script>
  9. export default {
  10. props: ['styles', 'datas'],
  11. computed: {
  12. /** 样式 */
  13. wrapper_style() {
  14. const {
  15. padding_top,
  16. padding_bottom,
  17. padding_left,
  18. padding_right,
  19. } = this.datas;
  20. let total = padding_left + padding_right
  21. return `
  22. line-height: 0;
  23. width: calc(100% - ${total*2}rpx);
  24. padding-top: ${padding_top}px;
  25. padding-bottom: ${padding_bottom}px;
  26. padding-left: ${padding_left}px;
  27. padding-right: ${padding_right}px;
  28. `;
  29. },
  30. video_url() {
  31. return this.datas.video_url || {};
  32. },
  33. },
  34. mounted() {
  35. this.$emit('loaded');
  36. }
  37. };
  38. </script>
  39. <style lang="less" scoped>
  40. // 默认
  41. .component-wrapper {
  42. width: 750rpx;
  43. }
  44. </style>