1 line
14 KiB
Plaintext
1 line
14 KiB
Plaintext
{"version":3,"file":"uni-collapse-item.js","sources":["../../../../../../../src/uni_modules/uni-collapse/components/uni-collapse-item/uni-collapse-item.vue","../../../../../../../uniComponent:/RDovQXBwL1dvcmsvYWRkci9hY2RyLXVpL3NyYy91bmlfbW9kdWxlcy91bmktY29sbGFwc2UvY29tcG9uZW50cy91bmktY29sbGFwc2UtaXRlbS91bmktY29sbGFwc2UtaXRlbS52dWU"],"sourcesContent":["<template>\r\n <view class=\"uni-collapse-item\">\r\n <!-- onClick(!isOpen) -->\r\n <view\r\n @click=\"onClick(!isOpen)\"\r\n class=\"uni-collapse-item__title\"\r\n :class=\"{\r\n 'is-open': isOpen && titleBorder === 'auto',\r\n 'uni-collapse-item-border': titleBorder !== 'none',\r\n }\"\r\n >\r\n <view class=\"uni-collapse-item__title-wrap\">\r\n <slot name=\"title\">\r\n <view class=\"uni-collapse-item__title-box\" :class=\"{ 'is-disabled': disabled }\">\r\n <image v-if=\"thumb\" :src=\"thumb\" class=\"uni-collapse-item__title-img\" />\r\n <text class=\"uni-collapse-item__title-text\">{{ title }}</text>\r\n </view>\r\n </slot>\r\n </view>\r\n <view\r\n v-if=\"showArrow\"\r\n :class=\"{\r\n 'uni-collapse-item__title-arrow-active': isOpen,\r\n 'uni-collapse-item--animation': showAnimation === true,\r\n }\"\r\n class=\"uni-collapse-item__title-arrow\"\r\n >\r\n <uni-icons :color=\"disabled ? '#ddd' : '#bbb'\" size=\"14\" type=\"bottom\" />\r\n </view>\r\n </view>\r\n <view\r\n class=\"uni-collapse-item__wrap\"\r\n :class=\"{ 'is--transition': showAnimation }\"\r\n :style=\"{ height: (isOpen ? height : 0) + 'px' }\"\r\n >\r\n <view\r\n :id=\"elId\"\r\n ref=\"collapse--hook\"\r\n class=\"uni-collapse-item__wrap-content\"\r\n :class=\"{ open: isheight, 'uni-collapse-item--border': border && isOpen }\"\r\n >\r\n <slot></slot>\r\n </view>\r\n </view>\r\n </view>\r\n</template>\r\n\r\n<script>\r\n// #ifdef APP-NVUE\r\nconst dom = weex.requireModule('dom')\r\n// #endif\r\n/**\r\n * CollapseItem 折叠面板子组件\r\n * @description 折叠面板子组件\r\n * @property {String} title 标题文字\r\n * @property {String} thumb 标题左侧缩略图\r\n * @property {String} name 唯一标志符\r\n * @property {Boolean} open = [true|false] 是否展开组件\r\n * @property {Boolean} titleBorder = [true|false] 是否显示标题分隔线\r\n * @property {Boolean} border = [true|false] 是否显示分隔线\r\n * @property {Boolean} disabled = [true|false] 是否展开面板\r\n * @property {Boolean} showAnimation = [true|false] 开启动画\r\n * @property {Boolean} showArrow = [true|false] 是否显示右侧箭头\r\n */\r\nexport default {\r\n name: 'uniCollapseItem',\r\n props: {\r\n // 列表标题\r\n title: {\r\n type: String,\r\n default: '',\r\n },\r\n name: {\r\n type: [Number, String],\r\n default: '',\r\n },\r\n // 是否禁用\r\n disabled: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n // #ifdef APP-PLUS\r\n // 是否显示动画,app 端默认不开启动画，卡顿严重\r\n showAnimation: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n // #endif\r\n // #ifndef APP-PLUS\r\n // 是否显示动画\r\n showAnimation: {\r\n type: Boolean,\r\n default: true,\r\n },\r\n // #endif\r\n // 是否展开\r\n open: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n // 缩略图\r\n thumb: {\r\n type: String,\r\n default: '',\r\n },\r\n // 标题分隔线显示类型\r\n titleBorder: {\r\n type: String,\r\n default: 'auto',\r\n },\r\n border: {\r\n type: Boolean,\r\n default: true,\r\n },\r\n showArrow: {\r\n type: Boolean,\r\n default: true,\r\n },\r\n },\r\n data() {\r\n // TODO 随机生生元素ID，解决百度小程序获取同一个元素位置信息的bug\r\n const elId = `Uni_${Math.ceil(Math.random() * 10e5).toString(36)}`\r\n return {\r\n isOpen: false,\r\n isheight: null,\r\n height: 0,\r\n elId,\r\n nameSync: 0,\r\n }\r\n },\r\n watch: {\r\n open(val) {\r\n this.isOpen = val\r\n this.onClick(val, 'init')\r\n },\r\n },\r\n updated(e) {\r\n this.$nextTick(() => {\r\n this.init(true)\r\n })\r\n },\r\n created() {\r\n this.collapse = this.getCollapse()\r\n this.oldHeight = 0\r\n this.onClick(this.open, 'init')\r\n },\r\n // #ifndef VUE3\r\n // TODO vue2\r\n destroyed() {\r\n if (this.__isUnmounted) return\r\n this.uninstall()\r\n },\r\n // #endif\r\n // #ifdef VUE3\r\n // TODO vue3\r\n unmounted() {\r\n this.__isUnmounted = true\r\n this.uninstall()\r\n },\r\n // #endif\r\n mounted() {\r\n if (!this.collapse) return\r\n if (this.name !== '') {\r\n this.nameSync = this.name\r\n } else {\r\n this.nameSync = this.collapse.childrens.length + ''\r\n }\r\n if (this.collapse.names.indexOf(this.nameSync) === -1) {\r\n this.collapse.names.push(this.nameSync)\r\n } else {\r\n console.warn(`name 值 ${this.nameSync} 重复`)\r\n }\r\n if (this.collapse.childrens.indexOf(this) === -1) {\r\n this.collapse.childrens.push(this)\r\n }\r\n this.init()\r\n },\r\n methods: {\r\n init(type) {\r\n // #ifndef APP-NVUE\r\n this.getCollapseHeight(type)\r\n // #endif\r\n // #ifdef APP-NVUE\r\n this.getNvueHwight(type)\r\n // #endif\r\n },\r\n uninstall() {\r\n if (this.collapse) {\r\n this.collapse.childrens.forEach((item, index) => {\r\n if (item === this) {\r\n this.collapse.childrens.splice(index, 1)\r\n }\r\n })\r\n this.collapse.names.forEach((item, index) => {\r\n if (item === this.nameSync) {\r\n this.collapse.names.splice(index, 1)\r\n }\r\n })\r\n }\r\n },\r\n onClick(isOpen, type) {\r\n if (this.disabled) return\r\n this.isOpen = isOpen\r\n if (this.isOpen && this.collapse) {\r\n this.collapse.setAccordion(this)\r\n }\r\n if (type !== 'init') {\r\n this.collapse.onChange(isOpen, this)\r\n }\r\n },\r\n getCollapseHeight(type, index = 0) {\r\n const views = uni.createSelectorQuery().in(this)\r\n views\r\n .select(`#${this.elId}`)\r\n .fields(\r\n {\r\n size: true,\r\n },\r\n (data) => {\r\n // TODO 百度中可能获取不到节点信息 ，需要循环获取\r\n if (index >= 10) return\r\n if (!data) {\r\n index++\r\n this.getCollapseHeight(false, index)\r\n return\r\n }\r\n // #ifdef APP-NVUE\r\n this.height = data.height + 1\r\n // #endif\r\n // #ifndef APP-NVUE\r\n this.height = data.height\r\n // #endif\r\n this.isheight = true\r\n if (type) return\r\n this.onClick(this.isOpen, 'init')\r\n },\r\n )\r\n .exec()\r\n },\r\n getNvueHwight(type) {\r\n const result = dom.getComponentRect(this.$refs['collapse--hook'], (option) => {\r\n if (option && option.result && option.size) {\r\n // #ifdef APP-NVUE\r\n this.height = option.size.height + 1\r\n // #endif\r\n // #ifndef APP-NVUE\r\n this.height = option.size.height\r\n // #endif\r\n this.isheight = true\r\n if (type) return\r\n this.onClick(this.open, 'init')\r\n }\r\n })\r\n },\r\n /**\r\n * 获取父元素实例\r\n */\r\n getCollapse(name = 'uniCollapse') {\r\n let parent = this.$parent\r\n let parentName = parent.$options.name\r\n while (parentName !== name) {\r\n parent = parent.$parent\r\n if (!parent) return false\r\n parentName = parent.$options.name\r\n }\r\n return parent\r\n },\r\n },\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\">\r\n.uni-collapse-item {\r\n /* #ifndef APP-NVUE */\r\n box-sizing: border-box;\r\n\r\n /* #endif */\r\n &__title {\r\n /* #ifndef APP-NVUE */\r\n display: flex;\r\n width: 100%;\r\n box-sizing: border-box;\r\n /* #endif */\r\n flex-direction: row;\r\n align-items: center;\r\n transition: border-bottom-color 0.3s;\r\n\r\n // transition-property: border-bottom-color;\r\n // transition-duration: 5s;\r\n &-wrap {\r\n width: 100%;\r\n flex: 1;\r\n }\r\n\r\n &-box {\r\n padding: 0 15px;\r\n /* #ifndef APP-NVUE */\r\n display: flex;\r\n width: 100%;\r\n box-sizing: border-box;\r\n /* #endif */\r\n flex-direction: row;\r\n justify-content: space-between;\r\n align-items: center;\r\n height: 48px;\r\n line-height: 48px;\r\n background-color: #fff;\r\n color: #303133;\r\n font-size: 13px;\r\n font-weight: 500;\r\n /* #ifdef H5 */\r\n cursor: pointer;\r\n outline: none;\r\n\r\n /* #endif */\r\n &.is-disabled {\r\n .uni-collapse-item__title-text {\r\n color: #999;\r\n }\r\n }\r\n }\r\n\r\n &.uni-collapse-item-border {\r\n border-bottom: 1px solid #ebeef5;\r\n }\r\n\r\n &.is-open {\r\n border-bottom-color: transparent;\r\n }\r\n\r\n &-img {\r\n height: 22px;\r\n width: 22px;\r\n margin-right: 10px;\r\n }\r\n\r\n &-text {\r\n flex: 1;\r\n font-size: 14px;\r\n /* #ifndef APP-NVUE */\r\n white-space: nowrap;\r\n color: inherit;\r\n /* #endif */\r\n /* #ifdef APP-NVUE */\r\n lines: 1;\r\n /* #endif */\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n }\r\n\r\n &-arrow {\r\n /* #ifndef APP-NVUE */\r\n display: flex;\r\n box-sizing: border-box;\r\n /* #endif */\r\n align-items: center;\r\n justify-content: center;\r\n width: 20px;\r\n height: 20px;\r\n margin-right: 10px;\r\n transform: rotate(0deg);\r\n\r\n &-active {\r\n transform: rotate(-180deg);\r\n }\r\n }\r\n }\r\n\r\n &__wrap {\r\n /* #ifndef APP-NVUE */\r\n will-change: height;\r\n box-sizing: border-box;\r\n /* #endif */\r\n background-color: #fff;\r\n overflow: hidden;\r\n position: relative;\r\n height: 0;\r\n\r\n &.is--transition {\r\n // transition: all 0.3s;\r\n transition-property: height, border-bottom-width;\r\n transition-duration: 0.3s;\r\n /* #ifndef APP-NVUE */\r\n will-change: height;\r\n /* #endif */\r\n }\r\n\r\n &-content {\r\n position: absolute;\r\n font-size: 13px;\r\n color: #303133;\r\n // transition: height 0.3s;\r\n border-bottom-color: transparent;\r\n border-bottom-style: solid;\r\n border-bottom-width: 0;\r\n\r\n &.uni-collapse-item--border {\r\n border-bottom-width: 1px;\r\n border-bottom-color: red;\r\n border-bottom-color: #ebeef5;\r\n }\r\n\r\n &.open {\r\n position: relative;\r\n }\r\n }\r\n }\r\n\r\n &--animation {\r\n transition-property: transform;\r\n transition-duration: 0.3s;\r\n transition-timing-function: ease;\r\n }\r\n}\r\n</style>\r\n","import Component from 'D:/App/Work/addr/acdr-ui/src/uni_modules/uni-collapse/components/uni-collapse-item/uni-collapse-item.vue'\nwx.createComponent(Component)"],"names":["uni"],"mappings":"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"} |