nest-component.vue 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. <template>
  2. <div >
  3. <div v-for="(el,index) in tasks" :key="el.unique"><!--:key="el.unique"-->
  4. <template v-if="el.moduleConfig.isCircleChild">
  5. <component :is="templates[el.tpl_id]" :data="el" :bind-data="bindData" :show="show" :child-data-index="childDataIndex">
  6. <van-grid-item v-for="i in ((el.moduleConfig.gridCloumns*el.moduleConfig.gridRows)>(bindData.items?bindData.items.length:0)?(bindData.items?bindData.items.length:0):(el.moduleConfig.gridCloumns*el.moduleConfig.gridRows))" :key="'grid-item'+i" style="padding: 5px;">
  7. <nest-component :tasks="el.children" :bind-data="bindData" :show="show" :child-data-index="i-1" />
  8. </van-grid-item>
  9. </component>
  10. </template>
  11. <template v-else>
  12. <component :is="templates[el.tpl_id]" :data="el" :bind-data="bindData" :show="show" :child-data-index="childDataIndex">
  13. <!-- <p>{{ el.name }}</p>-->
  14. <nest-component :tasks="el.children" :bind-data="bindData" :show="show" :child-data-index="childDataIndex"/>
  15. </component>
  16. </template>
  17. </div>
  18. </div>
  19. </template>
  20. <script>
  21. import templates, {templateArray} from './templates'
  22. export default {
  23. name: "nest-component",
  24. props: {
  25. tasks: {
  26. type:Array,
  27. default:([])
  28. },
  29. bindData:{
  30. type:Object,
  31. default:()=>({})
  32. },
  33. childDataIndex:{
  34. type:Number,
  35. default:0
  36. },
  37. // statisticData:{
  38. // type:Object,
  39. // default:()=>({})
  40. // },
  41. // /** 自定义看板项目*/
  42. // boardCustomerItems:{
  43. // type:Array,
  44. // default:([])
  45. // },
  46. /** 动画驱动**/
  47. show:{
  48. type:Boolean,
  49. default:true
  50. }
  51. },
  52. data(){
  53. return{
  54. templates,
  55. templateArray,
  56. floorOptions: {
  57. animation: 150,
  58. group: { name: 'tplGroup', put: true },
  59. sort: true,
  60. handle: '.handle-move'
  61. },
  62. }
  63. },
  64. mounted() {
  65. // console.log('child',this.data.children)
  66. }
  67. }
  68. </script>
  69. <style scoped>
  70. </style>