{"version":3,"sources":["webpack:///./src/custom-component/others/TabComponent/TabComponent.vue","webpack:///src/custom-component/others/TabComponent/TabComponent.vue","webpack:///./src/custom-component/others/TabComponent/TabComponent.vue?8585","webpack:///./src/custom-component/others/TabComponent/TabComponent.vue?8023","webpack:///./src/custom-component/others/TabComponent/TabComponent.vue?b7a9"],"names":["render","_vm","this","_c","_self","staticStyle","staticClass","style","tabHeader","_l","option","tabConfig","item","index","key","itemStyle","on","$event","currentTabSwitch","_v","_s","name","staticRenderFns","components","props","propValue","type","Object","require","default","element","data","currentTab","carouselInterval","mounted","carouselHandler","update","methods","_this","clearInterval","ifCarousel","carouselTime","Number","currentIndex","setInterval","length","width","marginRight","tabMargin","actived","borderBottom","index1","ele","ids","guid","idFilter","forEach","push","apply","_toConsumableArray","componentData","includes","showFlag","$forceUpdate","computed","_objectSpread","height","tabHeight","lineHeight","fontSize","tabFontSize","fontFamily","tabFontFamily","color","tabFontColor","display","flexWrap","justifyContent","tabPosition","backgourndColor","tabBackgroundColor","chartOption","dataset","$store","state","field","result","dataSource","FStaticSource","reflection","reflectionField","FBillFormSource","FDATASOURCE4","FPublicSource","mapState","watch","handler","immediate","deep","component"],"mappings":"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","file":"js/chunk-2c002959.cc669fde.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{staticStyle:{\"color\":\"#fff\"}},[_c('div',{staticClass:\"tab_header\",style:(_vm.tabHeader)},_vm._l((_vm.option.tabConfig),function(item,index){return _c('div',{key:index,style:(_vm.itemStyle(item, index)),on:{\"click\":function($event){return _vm.currentTabSwitch(index)}}},[_vm._v(\" \"+_vm._s(item.name)+\" \")])}),0),_c('div',{staticClass:\"body\"})])\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n    <div style=\"color: #fff;\">\r\n        <div :style=\"tabHeader\" class=\"tab_header\">\r\n            <div\r\n                v-for=\"(item, index) in option.tabConfig\"\r\n                :key=\"index\"\r\n                :style=\"itemStyle(item, index)\"\r\n                @click=\"currentTabSwitch(index)\"\r\n            >\r\n                {{ item.name }}\r\n            </div>\r\n        </div>\r\n        <div class=\"body\">\r\n            <!-- <div class=\"test\"></div> -->\r\n        </div>\r\n    </div>\r\n</template>\r\n\r\n<script>\r\nimport { mapState } from 'vuex';\r\n\r\nexport default {\r\n    name: 'TabComponent',\r\n    components: {},\r\n    props: {\r\n        propValue: {\r\n            // type: Object,\r\n            type: Object,\r\n            require: false,\r\n            default() {\r\n                return {};\r\n            },\r\n        },\r\n        element: {\r\n            type: Object,\r\n        },\r\n    },\r\n    data() {\r\n        return {\r\n            currentTab: [],\r\n            carouselInterval: null,\r\n        };\r\n    },\r\n    mounted() {\r\n        // this.getData();\r\n        // todo 初始 只显示页签1, 隐藏其它页签\r\n        // this.currentTabSwitch(this.option.tabConfig[0]);\r\n\r\n        // start 轮播\r\n        this.carouselHandler();\r\n    },\r\n    update() {},\r\n    methods: {\r\n        // 处理 页签轮播\r\n        carouselHandler() {\r\n            clearInterval(this.carouselInterval);\r\n            // console.log('已经清除了轮播',this.carouselInterval);\r\n            if ( this.option.ifCarousel) {\r\n                this.option.carouselTime = Number(this.option.carouselTime);\r\n                if (!this.option.carouselTime || this.option.carouselTime<0 || this.option.carouselTime > 1000) {\r\n                    // 默认10s\r\n                    this.option.carouselTime = 10;\r\n                }\r\n                // clearInterval(this.carouselInterval);\r\n\r\n                let currentIndex = 0;\r\n                this.carouselInterval = setInterval(() => {\r\n                    currentIndex++;\r\n                    if (currentIndex >= this.option.tabConfig.length) {\r\n                        currentIndex = 0;\r\n                    }\r\n                    this.currentTabSwitch(currentIndex);\r\n                }, this.option.carouselTime * 1000);\r\n            }\r\n        },\r\n        // 计算每个标签页的样式\r\n        itemStyle(item, index) {\r\n            let style = {\r\n                width: (item.width ? item.width : 100) + 'px',\r\n            };\r\n            if (index !== this.option.tabConfig.length - 1) {\r\n                style.marginRight = this.option.tabMargin + 'px';\r\n            }\r\n            if (item.actived) {\r\n                // 激活后特有的样式\r\n                // style.background = 'blue';\r\n                // style.color = '#000';\r\n                style.borderBottom = '2px solid #f5f5f5';\r\n            } else {\r\n                // style.background = 'red';\r\n                // style.color = '#999';\r\n                style.borderBottom = '2px solid #0000';\r\n            }\r\n            return style;\r\n        },\r\n        // 切换页签, 激活第 index1 个页签\r\n        currentTabSwitch(index1) {\r\n            let ele = this.option.tabConfig[index1]\r\n            if (ele.ids.length > 0 && this.element.propValue.guid) {\r\n                // 不显示的组件, 其它页签组件 id 的集合\r\n                let idFilter = [];\r\n                this.option.tabConfig.forEach((item, index) => {\r\n                    if (index !== index1) {\r\n                        idFilter.push(...item.ids);\r\n                        item.actived = false;\r\n                    } else {\r\n                        item.actived = true;\r\n                    }\r\n                });\r\n\r\n                // this.$forceUpdate();\r\n\r\n                this.componentData.forEach(item => {\r\n                    // console.log(item.style.showFlag);\r\n                    // 显示页签\r\n                    if (ele.ids.includes(item.propValue.guid)) {\r\n                        item.style.showFlag = true;\r\n                    }\r\n\r\n                    // 隐藏其它页签\r\n                    if (idFilter.includes(item.propValue.guid)) {\r\n                        // console.log('hide', item.name);\r\n                        item.style.showFlag = false;\r\n                    }\r\n                });\r\n            }\r\n\r\n            // console.timeEnd('sum');\r\n            // 强制更新\r\n            this.$forceUpdate();\r\n        },\r\n\r\n    },\r\n    computed: {\r\n        // 标签页样式\r\n        tabHeader() {\r\n            return {\r\n                height: this.option.tabHeight + 'px',\r\n                lineHeight: this.option.tabHeight + 'px',\r\n                fontSize: this.option.tabFontSize + 'px',\r\n                fontFamily: this.option.tabFontFamily,\r\n                color: this.option.tabFontColor,\r\n                display: 'flex',\r\n                flexWrap: 'warp',\r\n                justifyContent: this.option.tabPosition,\r\n                backgourndColor: this.option.tabBackgroundColor,\r\n                // border: '1px solid #ccc',\r\n            };\r\n        },\r\n        option() {\r\n            return this.propValue.chartOption;\r\n        },\r\n        dataset() {\r\n            return this.$store.state.dataset; // 总的refreshKanban 里的数据\r\n        },\r\n        // 映射字段\r\n        field() {\r\n            let result = [];\r\n            if (this.element.dataSource === 'static') {\r\n                this.element.FStaticSource.reflection.forEach(item => {\r\n                    result.push(item.reflectionField);\r\n                });\r\n            }\r\n            if (this.element.dataSource === 'billform') {\r\n                this.element.FBillFormSource.reflection.forEach(item => {\r\n                    result.push(item.reflectionField);\r\n                });\r\n            }\r\n            if (this.element.dataSource === 'api') {\r\n                this.element.FDATASOURCE4.reflection.forEach(item => {\r\n                    result.push(item.reflectionField);\r\n                });\r\n            }\r\n            if (this.element.dataSource === 'public') {\r\n                this.element.FPublicSource.reflection.forEach(item => {\r\n                    result.push(item.reflectionField);\r\n                });\r\n            }\r\n            return result;\r\n        },\r\n        ...mapState(['componentData']),\r\n    },\r\n    watch: {\r\n        /**\r\n         * 数据变化后, 重绘图表\r\n         */\r\n        element: {\r\n            handler() {\r\n                // this.getData();\r\n                // this.carouselHandler();\r\n            },\r\n            immediate: false,\r\n            deep: true,\r\n        },\r\n        'option.ifCarousel': {\r\n            handler() {\r\n                this.carouselHandler();\r\n            },\r\n            immediate: true,\r\n            deep: true,\r\n        },\r\n        'option.carouselTime': {\r\n            handler() {\r\n                this.carouselHandler();\r\n            },\r\n            immediate: true,\r\n            deep: true,\r\n        }\r\n        // dataset: {\r\n        //     handler() {\r\n        //         this.getData();\r\n        //     },\r\n        //     immediate: false,\r\n        //     deep: true,\r\n        // },\r\n    },\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.tab_header {\r\n    text-align: center;\r\n    cursor: pointer;\r\n}\r\n\r\n.test {\r\n    height: 80px;\r\n    width: 80px;\r\n    // border: 1px solid red;\r\n    // border-bottom-width: 20px;\r\n    position: relative;\r\n}\r\n\r\n.test:before {\r\n    content: '';\r\n    position: absolute;\r\n    left: 0;\r\n    bottom: 0;\r\n    width: 50%;\r\n    height: 1px;\r\n    border-bottom: 1px dashed #888888;\r\n    box-sizing: border-box;\r\n}\r\n</style>\r\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./TabComponent.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./TabComponent.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./TabComponent.vue?vue&type=template&id=324c3b7b&scoped=true&\"\nimport script from \"./TabComponent.vue?vue&type=script&lang=js&\"\nexport * from \"./TabComponent.vue?vue&type=script&lang=js&\"\nimport style0 from \"./TabComponent.vue?vue&type=style&index=0&id=324c3b7b&prod&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"324c3b7b\",\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--9-oneOf-1-0!../../../../node_modules/css-loader/dist/cjs.js??ref--9-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--9-oneOf-1-2!../../../../node_modules/sass-loader/dist/cjs.js??ref--9-oneOf-1-3!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./TabComponent.vue?vue&type=style&index=0&id=324c3b7b&prod&lang=scss&scoped=true&\""],"sourceRoot":""}