1.vue 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
  1. <template>
  2. <div class="imgNewsBigBox">
  3. <div v-if="templateData.componentList[0].component_style == 1">
  4. <!-- <news1Style :name="this.$store.state.template.pageData.class[dataSort].content.componentList[0].componentData.name"/> -->
  5. <news1Style
  6. v-if="templateData.componentList[0].data.text.length > 0"
  7. :titleLink="componentTitle1"
  8. :templateData="templateData.componentList[0].data"
  9. :skinId="skinId"
  10. />
  11. <nodata v-else :dataStyle="2" :dataWidth="720" :dataHeight="440" />
  12. </div>
  13. <div v-if="templateData.componentList[0].component_style == 2">
  14. <news2Style :name="this.$store.state.template.pageData.class[dataSort].content.componentList[0].componentData.name"/>
  15. </div>
  16. </div>
  17. </template>
  18. <script setup>
  19. //样式1
  20. import news1Style from '@/components/template/component/list/1200x410/1.vue'
  21. //样式2
  22. import news2Style from '@/components/template/component/list/1200x410/2.vue'
  23. //暂无数据
  24. import nodata from '@/components/template/component/public/nodata.vue'
  25. //引入vue
  26. import {ref} from 'vue';
  27. const props = defineProps({
  28. skinId: Number,//皮肤id
  29. templateData:Object,//新闻数据
  30. });
  31. //该通栏下只有一个组件
  32. const componentTitle1 = {
  33. alias:props.templateData.componentList[0].data.alias,
  34. aLIas_pinyin:props.templateData.componentList[0].data.pinyin,
  35. is_url: props.templateData.componentList[0].data.is_url,
  36. children_count: props.templateData.componentList[0].data.children_count,
  37. cid:props.templateData.componentList[0].data.category_id
  38. }
  39. </script>
  40. <style lang="less" scoped>
  41. .imgNewsBigBox{
  42. width: 1200px;
  43. height: 410px;
  44. position: relative;
  45. margin: 0 auto;
  46. margin-bottom: 30px;
  47. display: flex;
  48. justify-content: space-between;
  49. align-items: center;
  50. box-sizing: content-box;
  51. }
  52. </style>