dolphin-weex-ui 2.4.4 → 2.4.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.web.js
CHANGED
|
@@ -7898,7 +7898,7 @@ exports = module.exports = __webpack_require__(0)(true);
|
|
|
7898
7898
|
|
|
7899
7899
|
|
|
7900
7900
|
// module
|
|
7901
|
-
exports.push([module.i, "\n.wrapper-ipx {\n height: 0.90667rem;\n border-top-width: 1px;\n border-top-style: solid;\n}\n", "", {"version":3,"sources":["/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-ipx-bar/index.vue?
|
|
7901
|
+
exports.push([module.i, "\n.wrapper-ipx {\n height: 0.90667rem;\n border-top-width: 1px;\n border-top-style: solid;\n}\n", "", {"version":3,"sources":["/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-ipx-bar/index.vue?923f40a2"],"names":[],"mappings":";AAgEA;EACA,mBAAA;EACA,sBAAA;EACA,wBAAA;CACA","file":"index.vue","sourcesContent":["<template>\n <div\n class=\"wrapper-ipx\"\n v-if=\"show && isipx\"\n :style=\"{\n 'background-color': bgColor || 'transparent',\n 'border-top-color': borderTopColor || 'transparent'\n }\"\n ></div>\n</template>\n\n<script>\nimport { Bridge } from 'dolphin-native-bridge'\nexport default {\n props: {\n bgColor: String,\n borderTopColor: String,\n show: {\n type: Boolean,\n default: true\n }\n },\n data: () => ({\n bottomArc: 0\n }),\n computed: {\n isipx: function() {\n if (this.bottomArc) return true\n if ( weex.config.env.platform == \"harmony\" && weex.config.env.safeAreaBottomHeight ) return true\n return (\n weex &&\n (weex.config.env.deviceModel === 'iPhone10,3' ||\n weex.config.env.deviceModel === 'iPhone10,6' || //iphoneX\n weex.config.env.deviceModel === 'iPhone11,8' || //iPhone XR\n weex.config.env.deviceModel === 'iPhone11,2' || //iPhone XS\n weex.config.env.deviceModel === 'iPhone11,4' ||\n weex.config.env.deviceModel === 'iPhone11,6' || //iPhone XS Max\n weex.config.env.deviceModel === 'iPhone12,1' || //iPhone 11\n weex.config.env.deviceModel === 'iPhone12,3' || //iPhone 11 Pro\n weex.config.env.deviceModel === 'iPhone12,5' || //iPhone 11 Pro Max\n weex.config.env.deviceModel === 'iPhone13,1' || //iPhone 12 mini\n weex.config.env.deviceModel === 'iPhone13,2' || //iPhone 12\n weex.config.env.deviceModel === 'iPhone13,3' || //iPhone 12 Pro\n weex.config.env.deviceModel === 'iPhone13,4' || //iPhone 12 Pro Max\n weex.config.env.deviceModel === 'iPhone14,4' || //iPhone 13 mini\n weex.config.env.deviceModel === 'iPhone14,5' || //iPhone 13\n weex.config.env.deviceModel === 'iPhone14,2' || //iPhone 13 Pro\n weex.config.env.deviceModel === 'Iphone14,3' || //iPhone 13 Pro Max\n weex.config.env.deviceModel === 'iPhone14,7' || // iPhone 14\n weex.config.env.deviceModel === 'iPhone14,8' || // iPhone 14 Plus\n weex.config.env.deviceModel === 'iPhone15,2' || // iPhone 14 Pro\n weex.config.env.deviceModel === 'iPhone15,3') // iPhone 14 Pro Max\n )\n }\n },\n created() {\n Bridge.getAllBarHeight().then(res => {\n this.bottomArc = res.bottomArc || 0\n })\n }\n}\n</script>\n\n<style>\n.wrapper-ipx {\n height: 68px;\n border-top-width: 1px;\n border-top-style: solid;\n}\n</style>\n"],"sourceRoot":""}]);
|
|
7902
7902
|
|
|
7903
7903
|
// exports
|
|
7904
7904
|
|
|
@@ -9032,7 +9032,7 @@ exports = module.exports = __webpack_require__(0)(true);
|
|
|
9032
9032
|
|
|
9033
9033
|
|
|
9034
9034
|
// module
|
|
9035
|
-
exports.push([module.i, "\n.wrapper[data-v-70015f30] {\n z-index: 999;\n}\n.g-cover[data-v-70015f30] {\n position: fixed;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n /* background-color: rgba(0, 0, 0, 0.4); */\n z-index: 1;\n}\n.g-popover[data-v-70015f30] {\n position: fixed;\n padding: 0.2rem;\n z-index: 10;\n}\n.u-popover-arrow[data-v-70015f30] {\n position: absolute;\n /* border-radius: 4px; */\n width: 0.48rem;\n height: 0.48rem;\n background-color: #ffffff;\n -webkit-transform: rotateZ(45deg);\n transform: rotateZ(45deg);\n}\n.u-popover-inner[data-v-70015f30] {\n border-radius: 0.21333rem;\n background-color: #ffffff;\n max-width: 9.14667rem;\n}\n.content-inner[data-v-70015f30] {\n border-radius: 0.21333rem;\n max-width: 9.14667rem;\n padding: 0.32rem;\n display: -webkit-box;\n display: -webkit-flex;\n display: flex;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-pack: justify;\n -webkit-justify-content: space-between;\n justify-content: space-between;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n}\n.closeBox[data-v-70015f30] {\n padding-top: 0.13333rem;\n padding-bottom: 0.13333rem;\n padding-right: 0px;\n padding-left: 0.13333rem;\n}\n.closeIcon[data-v-70015f30] {\n width: 0.24rem;\n height: 0.24rem;\n}\n.u-popover-theme-white[data-v-70015f30] {\n background-color: #ffffff;\n}\n.u-popover-theme-dark[data-v-70015f30] {\n background-color: #1E2E37;\n}\n.i-btn[data-v-70015f30] {\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-pack: justify;\n -webkit-justify-content: space-between;\n justify-content: space-between;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n /* margin-left: 10px;\n margin-right: 10px; */\n /* padding-left: 20px; */\n /* padding-right: 20px; */\n}\n.row-layout[data-v-70015f30] {\n padding-left: 0.48rem;\n padding-right: 0.48rem;\n}\n.column-layout[data-v-70015f30] {\n padding-top: 0.02667rem;\n padding-bottom: 0.02667rem;\n}\n.borderRight[data-v-70015f30] {\n border-right-width: 1px;\n border-right-color: #eaeaeb;\n}\n.borderBottom[data-v-70015f30] {\n border-bottom-width: 1px;\n border-bottom-color: #eaeaeb;\n}\n.i-btn-noborder[data-v-70015f30] {\n border-bottom-color: #ffffff;\n}\n.btn-icon[data-v-70015f30] {\n width: 0.42667rem;\n height: 0.42667rem;\n margin-right: 0.21333rem;\n}\n.btn-text[data-v-70015f30] {\n -webkit-box-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n height: 1.28rem;\n font-size: 0.37333rem;\n line-height: 1.28rem;\n color: #232323;\n margin-left: 0.10667rem;\n}\n.btn-text-theme-dark[data-v-70015f30] {\n color: #ffffff;\n}\n.text-align-center[data-v-70015f30] {\n text-align: center;\n}\n.textContent[data-v-70015f30] {\n -webkit-box-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n font-family: PingFangSC-Regular;\n font-size: 0.32rem;\n color: #616C73;\n font-weight: 400;\n}\n", "", {"version":3,"sources":["/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-popover2/index.vue?5e790322"],"names":[],"mappings":";AA4dA;EACA,aAAA;CACA;AACA;EACA,gBAAA;EACA,OAAA;EACA,SAAA;EACA,QAAA;EACA,UAAA;EACA,2CAAA;EACA,WAAA;CACA;AACA;EACA,gBAAA;EACA,gBAAA;EACA,YAAA;CACA;AACA;EACA,mBAAA;EACA,yBAAA;EACA,eAAA;EACA,gBAAA;EACA,0BAAA;EACA,kCAAA;UAAA,0BAAA;CACA;AACA;EACA,0BAAA;EACA,0BAAA;EACA,sBAAA;CACA;AACA;EACA,0BAAA;EACA,sBAAA;EACA,iBAAA;EACA,qBAAA;EAAA,sBAAA;EAAA,cAAA;EACA,+BAAA;EAAA,8BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,0BAAA;EAAA,uCAAA;UAAA,+BAAA;EACA,0BAAA;EAAA,4BAAA;UAAA,oBAAA;CACA;AACA;EACA,wBAAA;EACA,2BAAA;EACA,mBAAA;EACA,yBAAA;CACA;AACA;EACA,eAAA;EACA,gBAAA;CACA;AAEA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,+BAAA;EAAA,8BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,0BAAA;EAAA,uCAAA;UAAA,+BAAA;EACA,0BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA;wBACA;EACA,yBAAA;EACA,0BAAA;CACA;AACA;EACA,sBAAA;EACA,uBAAA;CACA;AACA;EACA,wBAAA;EACA,2BAAA;CACA;AACA;EACA,wBAAA;EACA,4BAAA;CACA;AACA;EACA,yBAAA;EACA,6BAAA;CACA;AACA;EACA,6BAAA;CACA;AACA;EACA,kBAAA;EACA,mBAAA;EACA,yBAAA;CACA;AACA;EACA,oBAAA;EAAA,gBAAA;UAAA,QAAA;EACA,gBAAA;EACA,sBAAA;EACA,qBAAA;EACA,eAAA;EACA,wBAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,mBAAA;CACA;AACA;EACA,oBAAA;EAAA,gBAAA;UAAA,QAAA;EACA,gCAAA;EACA,mBAAA;EACA,eAAA;EACA,iBAAA;CACA","file":"index.vue","sourcesContent":["<!--\n* @description\n* @fileName dof-popover\n* @author liangzw\n* @date 2021/01/26 11:35:06\n!-->\n<template>\n <div class=\"wrapper\">\n <div class=\"g-cover\" ref=\"dof-cover\" v-if=\"show\" @click=\"clickCover\" :style=\"coverStyle\"></div>\n <div ref=\"dof-popover\" class=\"g-popover\" v-if=\"show && buttons.length\" :style=\"contentStyle\">\n <div :class=\"['u-popover-arrow', theme !== 'white' && 'u-popover-theme-dark']\" :style=\"arrowStyle\"></div>\n <scroller\n show-scrollbar=\"false\"\n :class=\"['u-popover-inner', theme !== 'white' && 'u-popover-theme-dark']\"\n :style=\"popoverInnerStyle\"\n ref=\"dof-inner-popover\"\n >\n <div\n :class=\"[\n 'i-btn',\n i === buttons.length - 1 ? 'i-btn-noborder' : '',\n layoutDirection == 'row' ? 'row-layout' : 'column-layout',\n layoutDirection == 'row' && i != buttons.length - 1 ? 'borderRight' : '',\n layoutDirection == 'column' && i != buttons.length - 1 ? 'borderBottom' : ''\n ]\"\n v-for=\"(item, i) in buttons\"\n :key=\"i\"\n @click=\"dofButtonClicked(i, item.key)\"\n >\n <image :src=\"item.icon\" v-if=\"item.icon && !_isColmo\" class=\"btn-icon\"></image>\n <dof-iconfont\n v-if=\"item.icon && _isColmo\"\n :code=\"item.icon\"\n :size=\"56\"\n :color=\"textStyle.color ? textStyle.color : 'rgba(255,255,255,0.80)'\"\n @dofIconFontClicked=\"dofButtonClicked(i, item.key)\"\n ></dof-iconfont>\n <text :class=\"['btn-text', theme !== 'white' && 'btn-text-theme-dark']\" :style=\"textStyle\">{{\n item.text\n }}</text>\n </div>\n </scroller>\n </div>\n <div ref=\"dof-popover\" class=\"g-popover\" v-if=\"show && !buttons.length\" :style=\"contentStyle\" @click=\"() => {}\">\n <div :class=\"['u-popover-arrow', theme !== 'white' && 'u-popover-theme-dark']\" :style=\"arrowStyle\"></div>\n <div class=\"content-inner\" ref=\"dof-inner-popover\" :style=\"innerContentStyle\">\n <slot>\n <text class=\"textContent\" :style=\"textStyle\">{{ textContent }}</text>\n <slot name=\"icon\">\n <div class=\"closeBox\" v-if=\"isShowClose\" @click=\"$emit('clickedCloseBtn')\">\n <image v-if=\"!_isColmo\" :src=\"imgs.close\" class=\"closeIcon\"></image>\n <dof-iconfont\n v-else\n :code=\"'\\u4725'\"\n :size=\"32\"\n :color=\"_isColmo ? 'rgba(255,255,255,0.80)' : '#1E2E37'\"\n @dofIconFontClicked=\"$emit('clickedCloseBtn')\"\n ></dof-iconfont>\n </div>\n </slot>\n </slot>\n </div>\n </div>\n </div>\n</template>\n\n<script>\nconst { env } = weex.config\nconst animation = weex.requireModule('animation')\nconst dom = weex.requireModule('dom')\nimport imgs from './imgs'\nimport ColmoMixin from '../../mixins/colmo'\nimport DofIconfont from '../dof-iconfont'\nexport default {\n mixins: [ColmoMixin],\n components: { DofIconfont },\n props: {\n mode: {\n type: String,\n default: 'common'\n },\n theme: {\n type: String,\n default: 'white'\n },\n layoutDirection: {\n type: String,\n default: 'column'\n },\n buttons: {\n type: Array,\n default: () => []\n },\n position: {\n type: Object,\n default: () => ({\n x: 0,\n y: 0\n })\n },\n arrowPosition: {\n type: Object,\n default: () => ({\n pos: 'top',\n x: 0,\n y: 0\n })\n },\n coverColor: {\n type: String,\n default: 'rgba(0, 0, 0, 0.1)'\n },\n hasAnimation: {\n type: Boolean,\n default: true\n },\n textStyle: {\n type: Object,\n default: () => ({})\n },\n textContent: {\n type: String,\n default: ''\n },\n innerBgColor: {\n type: String,\n default: ''\n },\n isClickCoverHide: {\n type: Boolean,\n default: true\n },\n isShowClose: {\n type: Boolean,\n default: false\n },\n width: {\n type: Number,\n default: 0\n },\n elPos: {\n type: Object,\n default: null\n }\n },\n data: () => ({\n sHeight: (env.deviceHeight / env.deviceWidth) * 750,\n show: false,\n showIn: false,\n imgs,\n position_: { x: 0, y: 0 }\n }),\n watch: {\n elPos(val) {\n setTimeout(() => {\n this.handleElPos(val)\n }, 100)\n },\n position: {\n handler(val) {\n if (!this.elPos) {\n this.position_ = val\n }\n },\n immediate: true\n }\n },\n created() {},\n computed: {\n coverStyle() {\n return this.coverColor\n ? { backgroundColor: this.coverColor, opacity: this.hasAnimation || !this.showIn ? '0' : '1' }\n : ''\n },\n transformOrigin() {\n const { x = 0, y = 0, pos = 'top' } = this.arrowPosition\n let _origins = []\n switch (pos) {\n case 'top':\n case 'bottom':\n _origins = [x < 0 ? 'right' : 'left', pos]\n break\n case 'left':\n case 'right':\n _origins = [pos, y < 0 ? 'bottom' : 'top']\n break\n }\n return _origins.join(' ')\n },\n contentTransform() {\n const { pos = 'top' } = this.arrowPosition\n let { x = 0, y = 0 } = this.arrowPosition\n const _translates = ['scale(0)']\n if (x >= 0 && x < 22) {\n x = 22\n } else if (x < 0 && x > -22) {\n x = -22\n }\n if (y >= 0 && y < 22) {\n y = 22\n } else if (y < 0 && y > -22) {\n y = -22\n }\n switch (pos) {\n case 'top':\n case 'bottom':\n _translates[1] = `translateX(${x < 0 ? x - 15 : x + 15}px)`\n break\n case 'left':\n case 'right':\n _translates[1] = `translateY(${y < 0 ? y - 15 : y + 15}px)`\n break\n }\n return _translates.join(' ')\n },\n contentStyle() {\n const { x = 0, y = 0 } = this.position_\n const style = {}\n if (!this.elPos) {\n x < 0 ? (style.right = `${-x}px`) : (style.left = `${x}px`)\n y < 0 ? (style.bottom = `${-y}px`) : (style.top = `${y}px`)\n } else {\n if (this.arrowPosition.pos === 'bottom') {\n style.left = `${x}px`\n style.top = `${y}px`\n } else {\n style.left = `${x}px`\n style.top = `${y}px`\n }\n }\n\n style.opacity = this.hasAnimation || !this.showIn ? '0' : '1'\n style.transform = this.hasAnimation || !this.showIn ? this.contentTransform : 'scale(1)'\n style.transformOrigin = this.transformOrigin\n return style\n },\n arrowStyle() {\n let { x = 0, y = 0 } = this.arrowPosition\n const { pos = 'top' } = this.arrowPosition\n const style = {\n backgroundColor: this.bgColor\n }\n switch (pos) {\n case 'top':\n style.top = '6px'\n case 'bottom': //eslint-disable-line\n !style.top && (style.bottom = '6px')\n // style.transform = 'rotateZ(45deg) rotateY(45deg)'\n if (x >= 0 && x < 22) {\n x = 22\n } else if (x < 0 && x > -22) {\n x = -22\n }\n x < 0 ? (style.right = `${-x}px`) : (style.left = `${x}px`)\n break\n case 'left':\n style.left = '6px'\n case 'right': //eslint-disable-line\n !style.left && (style.right = '6px')\n // style.transform = 'scaleY(0.8) rotate(45deg)'\n if (y >= 0 && y < 22) {\n y = 22\n } else if (y < 0 && y > -22) {\n y = -22\n }\n y < 0 ? (style.bottom = `${-y}px`) : (style.top = `${y}px`)\n break\n default:\n break\n }\n return style\n },\n popoverInnerStyle() {\n let { layoutDirection } = this\n if (layoutDirection === 'row') {\n return {\n ...this.innerContentStyle,\n flexDirection: 'row'\n }\n } else {\n return {\n ...this.innerContentStyle,\n flexDirection: 'column'\n }\n }\n },\n btnInnerStyle() {\n let { layoutDirection } = this\n if (layoutDirection === 'row') {\n return {\n borderRightWidth: '1px'\n }\n } else {\n return {\n borderBottomWidth: '1px'\n }\n }\n },\n bgColor() {\n return this.innerBgColor ? this.innerBgColor : this.theme === 'dark' ? '#000' : this._isColmo ? '#292b2f' : '#fff'\n },\n innerContentStyle() {\n const style = {\n backgroundColor: this.bgColor\n }\n if (this.width) style.width = this.width + 'px'\n if (this._isColmo && this.isShowClose) style.paddingRight = '10px'\n return style\n }\n },\n methods: {\n dofPopoverShow() {\n if (this.animationLock) {\n return\n }\n if (this.elPos.el) this.handleElPos(this.elPos)\n this.show = true\n if (this.hasAnimation) {\n setTimeout(() => this.dofPopoverAnimationShow(), 40)\n } else {\n setTimeout(() => (this.showIn = true), 40)\n }\n },\n /**\n * smooth in\n **/\n dofPopoverAnimationShow() {\n const popoverEl = this.$refs['dof-popover']\n const coverEl = this.$refs['dof-cover']\n if (!coverEl || !popoverEl) {\n return\n }\n this.setAnimationLock()\n let a1End = false\n let a2End = false\n animation.transition(\n popoverEl,\n {\n styles: {\n opacity: 1,\n transform: 'scale(1)',\n transformOrigin: this.transformOrigin\n },\n delay: 0,\n duration: 250,\n timingFunction: 'ease-out'\n },\n e => {\n a1End = true\n if (a1End && a2End) {\n this.animationLock = false\n }\n }\n )\n\n animation.transition(\n coverEl,\n {\n styles: {\n opacity: 1\n },\n delay: 0,\n duration: 250,\n timingFunction: 'ease-in'\n },\n e => {\n a2End = true\n if (a1End && a2End) {\n this.animationLock = false\n }\n }\n )\n },\n dofButtonClicked(index, key) {\n if (this.animationLock) {\n return\n }\n this.$emit('dofPopoverButtonClicked', { key, index })\n this.hideAction()\n },\n /**\n * 隐藏操作\n */\n hideAction() {\n if (this.animationLock) {\n return\n }\n if (this.hasAnimation) {\n this.setAnimationLock()\n const popoverEl = this.$refs['dof-popover']\n const coverEl = this.$refs['dof-cover']\n if (!popoverEl || !coverEl) {\n return\n }\n let a1End = false\n let a2End = false\n animation.transition(\n popoverEl,\n {\n styles: {\n opacity: 0,\n transform: this.contentTransform,\n transformOrigin: this.transformOrigin\n },\n duration: 250\n },\n () => {\n a1End = true\n if (a1End && a2End) {\n this.show = false\n this.showIn = false\n this.animationLock = false\n }\n }\n )\n animation.transition(\n coverEl,\n {\n styles: {\n opacity: 0\n },\n duration: 250\n },\n () => {\n a2End = true\n if (a1End && a2End) {\n this.show = false\n this.showIn = false\n this.animationLock = false\n }\n }\n )\n } else {\n this.show = false\n this.showIn = false\n }\n },\n /**\n * 设置动画锁\n */\n setAnimationLock() {\n this.animationLock = true\n },\n clickCover() {\n this.isClickCoverHide && this.hideAction()\n this.$emit('dofPopoverCoverClicked')\n },\n getPosition(el) {\n return new Promise((resolve, reject) => {\n dom.getComponentRect(el, result => {\n let size = result.size || {}\n resolve(size)\n })\n })\n },\n async handleElPos(val) {\n if (!val.el) return\n const res = await this.getPosition(val.el)\n if (this.arrowPosition.pos === 'top' || !this.arrowPosition.pos) {\n this.position_ = { x: res.left - 15 + this.elPos.offsetX, y: res.top + res.height + this.elPos.offsetY }\n }\n if (this.arrowPosition.pos === 'bottom') {\n this.position_ = { x: res.left - 15 + this.elPos.offsetX, y: res.top - 110 - 15 + this.elPos.offsetY }\n }\n if (this.arrowPosition.pos === 'left') {\n this.position_ = { x: res.left + res.width + 10 + this.elPos.offsetX, y: res.top - 15 + this.elPos.offsetY }\n }\n if (this.arrowPosition.pos === 'right') {\n this.position_ = { x: res.left - 285 + this.elPos.offsetX, y: res.top - 15 + this.elPos.offsetY }\n }\n }\n }\n}\n</script>\n\n<style scoped>\n.wrapper {\n z-index: 999;\n}\n.g-cover {\n position: fixed;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n /* background-color: rgba(0, 0, 0, 0.4); */\n z-index: 1;\n}\n.g-popover {\n position: fixed;\n padding: 15px;\n z-index: 10;\n}\n.u-popover-arrow {\n position: absolute;\n /* border-radius: 4px; */\n width: 36px;\n height: 36px;\n background-color: #ffffff;\n transform: rotateZ(45deg);\n}\n.u-popover-inner {\n border-radius: 16px;\n background-color: #ffffff;\n max-width: 686px;\n}\n.content-inner {\n border-radius: 16px;\n max-width: 686px;\n padding: 24px;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n}\n.closeBox {\n padding-top: 10px;\n padding-bottom: 10px;\n padding-right: 0px;\n padding-left: 10px;\n}\n.closeIcon {\n width: 18px;\n height: 18px;\n}\n\n.u-popover-theme-white {\n background-color: #ffffff;\n}\n.u-popover-theme-dark {\n background-color: #1E2E37;\n}\n.i-btn {\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n /* margin-left: 10px;\n margin-right: 10px; */\n /* padding-left: 20px; */\n /* padding-right: 20px; */\n}\n.row-layout {\n padding-left: 36px;\n padding-right: 36px;\n}\n.column-layout {\n padding-top: 2px;\n padding-bottom: 2px;\n}\n.borderRight {\n border-right-width: 1px;\n border-right-color: #eaeaeb;\n}\n.borderBottom {\n border-bottom-width: 1px;\n border-bottom-color: #eaeaeb;\n}\n.i-btn-noborder {\n border-bottom-color: #ffffff;\n}\n.btn-icon {\n width: 32px;\n height: 32px;\n margin-right: 16px;\n}\n.btn-text {\n flex: 1;\n height: 96px;\n font-size: 28px;\n line-height: 96px;\n color: #232323;\n margin-left: 8px;\n}\n.btn-text-theme-dark {\n color: #ffffff;\n}\n.text-align-center {\n text-align: center;\n}\n.textContent {\n flex: 1;\n font-family: PingFangSC-Regular;\n font-size: 24px;\n color: #616C73;\n font-weight: 400;\n}\n</style>\n\n<style scoped src=\"./colmo.css\"></style>\n<style scoped src=\"./diablo.css\"></style>\n"],"sourceRoot":""}]);
|
|
9035
|
+
exports.push([module.i, "\n.wrapper[data-v-70015f30] {\n z-index: 999;\n}\n.g-cover[data-v-70015f30] {\n position: fixed;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n /* background-color: rgba(0, 0, 0, 0.4); */\n z-index: 1;\n}\n.g-popover[data-v-70015f30] {\n position: fixed;\n padding: 0.2rem;\n z-index: 10;\n}\n.u-popover-arrow[data-v-70015f30] {\n position: absolute;\n /* border-radius: 4px; */\n width: 0.48rem;\n height: 0.48rem;\n background-color: #ffffff;\n -webkit-transform: rotateZ(45deg);\n transform: rotateZ(45deg);\n}\n.u-popover-inner[data-v-70015f30] {\n border-radius: 0.21333rem;\n background-color: #ffffff;\n max-width: 9.14667rem;\n}\n.content-inner[data-v-70015f30] {\n border-radius: 0.21333rem;\n max-width: 9.14667rem;\n padding: 0.32rem;\n display: -webkit-box;\n display: -webkit-flex;\n display: flex;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-pack: justify;\n -webkit-justify-content: space-between;\n justify-content: space-between;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n}\n.closeBox[data-v-70015f30] {\n padding-top: 0.13333rem;\n padding-bottom: 0.13333rem;\n padding-right: 0px;\n padding-left: 0.13333rem;\n}\n.closeIcon[data-v-70015f30] {\n width: 0.24rem;\n height: 0.24rem;\n}\n.u-popover-theme-white[data-v-70015f30] {\n background-color: #ffffff;\n}\n.u-popover-theme-dark[data-v-70015f30] {\n background-color: #1E2E37;\n}\n.i-btn[data-v-70015f30] {\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-pack: justify;\n -webkit-justify-content: space-between;\n justify-content: space-between;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n /* margin-left: 10px;\n margin-right: 10px; */\n /* padding-left: 20px; */\n /* padding-right: 20px; */\n}\n.row-layout[data-v-70015f30] {\n padding-left: 0.48rem;\n padding-right: 0.48rem;\n}\n.column-layout[data-v-70015f30] {\n padding-top: 0.02667rem;\n padding-bottom: 0.02667rem;\n}\n.borderRight[data-v-70015f30] {\n border-right-width: 1px;\n border-right-color: #eaeaeb;\n}\n.borderBottom[data-v-70015f30] {\n border-bottom-width: 1px;\n border-bottom-color: #eaeaeb;\n}\n.i-btn-noborder[data-v-70015f30] {\n border-bottom-color: #ffffff;\n}\n.btn-icon[data-v-70015f30] {\n width: 0.42667rem;\n height: 0.42667rem;\n margin-right: 0.21333rem;\n}\n.btn-text[data-v-70015f30] {\n -webkit-box-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n height: 1.28rem;\n font-size: 0.37333rem;\n line-height: 1.28rem;\n color: #232323;\n margin-left: 0.10667rem;\n}\n.btn-text-theme-dark[data-v-70015f30] {\n color: #ffffff;\n}\n.text-align-center[data-v-70015f30] {\n text-align: center;\n}\n.textContent[data-v-70015f30] {\n -webkit-box-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n font-family: PingFangSC-Regular;\n font-size: 0.32rem;\n color: #616C73;\n font-weight: 400;\n}\n", "", {"version":3,"sources":["/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-popover2/index.vue?868baf72"],"names":[],"mappings":";AA4dA;EACA,aAAA;CACA;AACA;EACA,gBAAA;EACA,OAAA;EACA,SAAA;EACA,QAAA;EACA,UAAA;EACA,2CAAA;EACA,WAAA;CACA;AACA;EACA,gBAAA;EACA,gBAAA;EACA,YAAA;CACA;AACA;EACA,mBAAA;EACA,yBAAA;EACA,eAAA;EACA,gBAAA;EACA,0BAAA;EACA,kCAAA;UAAA,0BAAA;CACA;AACA;EACA,0BAAA;EACA,0BAAA;EACA,sBAAA;CACA;AACA;EACA,0BAAA;EACA,sBAAA;EACA,iBAAA;EACA,qBAAA;EAAA,sBAAA;EAAA,cAAA;EACA,+BAAA;EAAA,8BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,0BAAA;EAAA,uCAAA;UAAA,+BAAA;EACA,0BAAA;EAAA,4BAAA;UAAA,oBAAA;CACA;AACA;EACA,wBAAA;EACA,2BAAA;EACA,mBAAA;EACA,yBAAA;CACA;AACA;EACA,eAAA;EACA,gBAAA;CACA;AAEA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,+BAAA;EAAA,8BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,0BAAA;EAAA,uCAAA;UAAA,+BAAA;EACA,0BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA;wBACA;EACA,yBAAA;EACA,0BAAA;CACA;AACA;EACA,sBAAA;EACA,uBAAA;CACA;AACA;EACA,wBAAA;EACA,2BAAA;CACA;AACA;EACA,wBAAA;EACA,4BAAA;CACA;AACA;EACA,yBAAA;EACA,6BAAA;CACA;AACA;EACA,6BAAA;CACA;AACA;EACA,kBAAA;EACA,mBAAA;EACA,yBAAA;CACA;AACA;EACA,oBAAA;EAAA,gBAAA;UAAA,QAAA;EACA,gBAAA;EACA,sBAAA;EACA,qBAAA;EACA,eAAA;EACA,wBAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,mBAAA;CACA;AACA;EACA,oBAAA;EAAA,gBAAA;UAAA,QAAA;EACA,gCAAA;EACA,mBAAA;EACA,eAAA;EACA,iBAAA;CACA","file":"index.vue","sourcesContent":["<!--\n* @description\n* @fileName dof-popover\n* @author liangzw\n* @date 2021/01/26 11:35:06\n!-->\n<template>\n <div class=\"wrapper\">\n <div class=\"g-cover\" ref=\"dof-cover\" v-if=\"show\" @click=\"clickCover\" :style=\"coverStyle\"></div>\n <div ref=\"dof-popover\" class=\"g-popover\" v-if=\"show && buttons.length\" :style=\"contentStyle\">\n <div :class=\"['u-popover-arrow', theme !== 'white' && 'u-popover-theme-dark']\" :style=\"arrowStyle\"></div>\n <scroller\n show-scrollbar=\"false\"\n :class=\"['u-popover-inner', theme !== 'white' && 'u-popover-theme-dark']\"\n :style=\"popoverInnerStyle\"\n ref=\"dof-inner-popover\"\n >\n <div\n :class=\"[\n 'i-btn',\n i === buttons.length - 1 ? 'i-btn-noborder' : '',\n layoutDirection == 'row' ? 'row-layout' : 'column-layout',\n layoutDirection == 'row' && i != buttons.length - 1 ? 'borderRight' : '',\n layoutDirection == 'column' && i != buttons.length - 1 ? 'borderBottom' : ''\n ]\"\n v-for=\"(item, i) in buttons\"\n :key=\"i\"\n @click=\"dofButtonClicked(i, item.key)\"\n >\n <image :src=\"item.icon\" v-if=\"item.icon && !_isColmo\" class=\"btn-icon\"></image>\n <dof-iconfont\n v-if=\"item.icon && _isColmo\"\n :code=\"item.icon\"\n :size=\"56\"\n :color=\"textStyle.color ? textStyle.color : 'rgba(255,255,255,0.80)'\"\n @dofIconFontClicked=\"dofButtonClicked(i, item.key)\"\n ></dof-iconfont>\n <text :class=\"['btn-text', theme !== 'white' && 'btn-text-theme-dark']\" :style=\"textStyle\">{{\n item.text\n }}</text>\n </div>\n </scroller>\n </div>\n <div ref=\"dof-popover\" class=\"g-popover\" v-if=\"show && !buttons.length\" :style=\"contentStyle\" @click=\"() => {}\">\n <div :class=\"['u-popover-arrow', theme !== 'white' && 'u-popover-theme-dark']\" :style=\"arrowStyle\"></div>\n <div class=\"content-inner\" ref=\"dof-inner-popover\" :style=\"innerContentStyle\">\n <slot>\n <text class=\"textContent\" :style=\"textStyle\">{{ textContent }}</text>\n <slot name=\"icon\">\n <div class=\"closeBox\" v-if=\"isShowClose\" @click=\"$emit('clickedCloseBtn')\">\n <image v-if=\"!_isColmo\" :src=\"imgs.close\" class=\"closeIcon\"></image>\n <dof-iconfont\n v-else\n :code=\"'\\u4725'\"\n :size=\"32\"\n :color=\"_isColmo ? 'rgba(255,255,255,0.80)' : '#1E2E37'\"\n @dofIconFontClicked=\"$emit('clickedCloseBtn')\"\n ></dof-iconfont>\n </div>\n </slot>\n </slot>\n </div>\n </div>\n </div>\n</template>\n\n<script>\nconst { env } = weex.config\nconst animation = weex.requireModule('animation')\nconst dom = weex.requireModule('dom')\nimport imgs from './imgs'\nimport ColmoMixin from '../../mixins/colmo'\nimport DofIconfont from '../dof-iconfont'\nexport default {\n mixins: [ColmoMixin],\n components: { DofIconfont },\n props: {\n mode: {\n type: String,\n default: 'common'\n },\n theme: {\n type: String,\n default: 'white'\n },\n layoutDirection: {\n type: String,\n default: 'column'\n },\n buttons: {\n type: Array,\n default: () => []\n },\n position: {\n type: Object,\n default: () => ({\n x: 0,\n y: 0\n })\n },\n arrowPosition: {\n type: Object,\n default: () => ({\n pos: 'top',\n x: 0,\n y: 0\n })\n },\n coverColor: {\n type: String,\n default: 'rgba(0, 0, 0, 0.1)'\n },\n hasAnimation: {\n type: Boolean,\n default: true\n },\n textStyle: {\n type: Object,\n default: () => ({})\n },\n textContent: {\n type: String,\n default: ''\n },\n innerBgColor: {\n type: String,\n default: ''\n },\n isClickCoverHide: {\n type: Boolean,\n default: true\n },\n isShowClose: {\n type: Boolean,\n default: false\n },\n width: {\n type: Number,\n default: 0\n },\n elPos: {\n type: Object,\n default: null\n }\n },\n data: () => ({\n sHeight: (env.deviceHeight / env.deviceWidth) * 750,\n show: false,\n showIn: false,\n imgs,\n position_: { x: 0, y: 0 }\n }),\n watch: {\n elPos(val) {\n setTimeout(() => {\n this.handleElPos(val)\n }, 100)\n },\n position: {\n handler(val) {\n if (!this.elPos) {\n this.position_ = val\n }\n },\n immediate: true\n }\n },\n created() {},\n computed: {\n coverStyle() {\n return this.coverColor\n ? { backgroundColor: this.coverColor, opacity: this.hasAnimation || !this.showIn ? '0' : '1' }\n : ''\n },\n transformOrigin() {\n const { x = 0, y = 0, pos = 'top' } = this.arrowPosition\n let _origins = []\n switch (pos) {\n case 'top':\n case 'bottom':\n _origins = [x < 0 ? 'right' : 'left', pos]\n break\n case 'left':\n case 'right':\n _origins = [pos, y < 0 ? 'bottom' : 'top']\n break\n }\n return _origins.join(' ')\n },\n contentTransform() {\n const { pos = 'top' } = this.arrowPosition\n let { x = 0, y = 0 } = this.arrowPosition\n const _translates = ['scale(0)']\n if (x >= 0 && x < 22) {\n x = 22\n } else if (x < 0 && x > -22) {\n x = -22\n }\n if (y >= 0 && y < 22) {\n y = 22\n } else if (y < 0 && y > -22) {\n y = -22\n }\n switch (pos) {\n case 'top':\n case 'bottom':\n _translates[1] = `translateX(${x < 0 ? x - 15 : x + 15}px)`\n break\n case 'left':\n case 'right':\n _translates[1] = `translateY(${y < 0 ? y - 15 : y + 15}px)`\n break\n }\n return _translates.join(' ')\n },\n contentStyle() {\n const { x = 0, y = 0 } = this.position_\n const style = {}\n if (!this.elPos) {\n x < 0 ? (style.right = `${-x}px`) : (style.left = `${x}px`)\n y < 0 ? (style.bottom = `${-y}px`) : (style.top = `${y}px`)\n } else {\n if (this.arrowPosition.pos === 'bottom') {\n style.left = `${x}px`\n style.top = `${y}px`\n } else {\n style.left = `${x}px`\n style.top = `${y}px`\n }\n }\n\n style.opacity = this.hasAnimation || !this.showIn ? '0' : '1'\n style.transform = this.hasAnimation || !this.showIn ? this.contentTransform : 'scale(1)'\n style.transformOrigin = this.transformOrigin\n return style\n },\n arrowStyle() {\n let { x = 0, y = 0 } = this.arrowPosition\n const { pos = 'top' } = this.arrowPosition\n const style = {\n backgroundColor: this.bgColor\n }\n switch (pos) {\n case 'top':\n style.top = '6px'\n case 'bottom': //eslint-disable-line\n !style.top && (style.bottom = '6px')\n // style.transform = 'rotateZ(45deg) rotateY(45deg)'\n if (x >= 0 && x < 22) {\n x = 22\n } else if (x < 0 && x > -22) {\n x = -22\n }\n x < 0 ? (style.right = `${-x}px`) : (style.left = `${x}px`)\n break\n case 'left':\n style.left = '6px'\n case 'right': //eslint-disable-line\n !style.left && (style.right = '6px')\n // style.transform = 'scaleY(0.8) rotate(45deg)'\n if (y >= 0 && y < 22) {\n y = 22\n } else if (y < 0 && y > -22) {\n y = -22\n }\n y < 0 ? (style.bottom = `${-y}px`) : (style.top = `${y}px`)\n break\n default:\n break\n }\n return style\n },\n popoverInnerStyle() {\n let { layoutDirection } = this\n if (layoutDirection === 'row') {\n return {\n ...this.innerContentStyle,\n flexDirection: 'row'\n }\n } else {\n return {\n ...this.innerContentStyle,\n flexDirection: 'column'\n }\n }\n },\n btnInnerStyle() {\n let { layoutDirection } = this\n if (layoutDirection === 'row') {\n return {\n borderRightWidth: '1px'\n }\n } else {\n return {\n borderBottomWidth: '1px'\n }\n }\n },\n bgColor() {\n return this.innerBgColor ? this.innerBgColor : this.theme === 'dark' ? '#000' : this._isColmo ? '#292b2f' : '#fff'\n },\n innerContentStyle() {\n const style = {\n backgroundColor: this.bgColor\n }\n if (this.width) style.width = this.width + 'px'\n if (this._isColmo && this.isShowClose) style.paddingRight = '10px'\n return style\n }\n },\n methods: {\n dofPopoverShow() {\n if (this.animationLock) {\n return\n }\n if (this.elPos.el) this.handleElPos(this.elPos)\n this.show = true\n if (this.hasAnimation) {\n setTimeout(() => this.dofPopoverAnimationShow(), 40)\n } else {\n setTimeout(() => (this.showIn = true), 40)\n }\n },\n /**\n * smooth in\n **/\n dofPopoverAnimationShow() {\n const popoverEl = this.$refs['dof-popover']\n const coverEl = this.$refs['dof-cover']\n if (!coverEl || !popoverEl) {\n return\n }\n this.setAnimationLock()\n let a1End = false\n let a2End = false\n animation.transition(\n popoverEl,\n {\n styles: {\n opacity: 1,\n transform: 'scale(1)',\n transformOrigin: this.transformOrigin\n },\n delay: 0,\n duration: 250,\n timingFunction: 'ease-out'\n },\n e => {\n a1End = true\n if (a1End && a2End) {\n this.animationLock = false\n }\n }\n )\n\n animation.transition(\n coverEl,\n {\n styles: {\n opacity: 1\n },\n delay: 0,\n duration: 250,\n timingFunction: 'ease-in'\n },\n e => {\n a2End = true\n if (a1End && a2End) {\n this.animationLock = false\n }\n }\n )\n },\n dofButtonClicked(index, key) {\n if (this.animationLock) {\n return\n }\n this.$emit('dofPopoverButtonClicked', { key, index })\n this.hideAction()\n },\n /**\n * 隐藏操作\n */\n hideAction() {\n if (this.animationLock) {\n return\n }\n if (this.hasAnimation && this.show) {\n this.setAnimationLock()\n const popoverEl = this.$refs['dof-popover']\n const coverEl = this.$refs['dof-cover']\n if (!popoverEl || !coverEl) {\n return\n }\n let a1End = false\n let a2End = false\n animation.transition(\n popoverEl,\n {\n styles: {\n opacity: 0,\n transform: this.contentTransform,\n transformOrigin: this.transformOrigin\n },\n duration: 250\n },\n () => {\n a1End = true\n if (a1End && a2End) {\n this.show = false\n this.showIn = false\n this.animationLock = false\n }\n }\n )\n animation.transition(\n coverEl,\n {\n styles: {\n opacity: 0\n },\n duration: 250\n },\n () => {\n a2End = true\n if (a1End && a2End) {\n this.show = false\n this.showIn = false\n this.animationLock = false\n }\n }\n )\n } else {\n this.show = false\n this.showIn = false\n }\n },\n /**\n * 设置动画锁\n */\n setAnimationLock() {\n this.animationLock = true\n },\n clickCover() {\n this.isClickCoverHide && this.hideAction()\n this.$emit('dofPopoverCoverClicked')\n },\n getPosition(el) {\n return new Promise((resolve, reject) => {\n dom.getComponentRect(el, result => {\n let size = result.size || {}\n resolve(size)\n })\n })\n },\n async handleElPos(val) {\n if (!val.el) return\n const res = await this.getPosition(val.el)\n if (this.arrowPosition.pos === 'top' || !this.arrowPosition.pos) {\n this.position_ = { x: res.left - 15 + this.elPos.offsetX, y: res.top + res.height + this.elPos.offsetY }\n }\n if (this.arrowPosition.pos === 'bottom') {\n this.position_ = { x: res.left - 15 + this.elPos.offsetX, y: res.top - 110 - 15 + this.elPos.offsetY }\n }\n if (this.arrowPosition.pos === 'left') {\n this.position_ = { x: res.left + res.width + 10 + this.elPos.offsetX, y: res.top - 15 + this.elPos.offsetY }\n }\n if (this.arrowPosition.pos === 'right') {\n this.position_ = { x: res.left - 285 + this.elPos.offsetX, y: res.top - 15 + this.elPos.offsetY }\n }\n }\n }\n}\n</script>\n\n<style scoped>\n.wrapper {\n z-index: 999;\n}\n.g-cover {\n position: fixed;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n /* background-color: rgba(0, 0, 0, 0.4); */\n z-index: 1;\n}\n.g-popover {\n position: fixed;\n padding: 15px;\n z-index: 10;\n}\n.u-popover-arrow {\n position: absolute;\n /* border-radius: 4px; */\n width: 36px;\n height: 36px;\n background-color: #ffffff;\n transform: rotateZ(45deg);\n}\n.u-popover-inner {\n border-radius: 16px;\n background-color: #ffffff;\n max-width: 686px;\n}\n.content-inner {\n border-radius: 16px;\n max-width: 686px;\n padding: 24px;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n}\n.closeBox {\n padding-top: 10px;\n padding-bottom: 10px;\n padding-right: 0px;\n padding-left: 10px;\n}\n.closeIcon {\n width: 18px;\n height: 18px;\n}\n\n.u-popover-theme-white {\n background-color: #ffffff;\n}\n.u-popover-theme-dark {\n background-color: #1E2E37;\n}\n.i-btn {\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n /* margin-left: 10px;\n margin-right: 10px; */\n /* padding-left: 20px; */\n /* padding-right: 20px; */\n}\n.row-layout {\n padding-left: 36px;\n padding-right: 36px;\n}\n.column-layout {\n padding-top: 2px;\n padding-bottom: 2px;\n}\n.borderRight {\n border-right-width: 1px;\n border-right-color: #eaeaeb;\n}\n.borderBottom {\n border-bottom-width: 1px;\n border-bottom-color: #eaeaeb;\n}\n.i-btn-noborder {\n border-bottom-color: #ffffff;\n}\n.btn-icon {\n width: 32px;\n height: 32px;\n margin-right: 16px;\n}\n.btn-text {\n flex: 1;\n height: 96px;\n font-size: 28px;\n line-height: 96px;\n color: #232323;\n margin-left: 8px;\n}\n.btn-text-theme-dark {\n color: #ffffff;\n}\n.text-align-center {\n text-align: center;\n}\n.textContent {\n flex: 1;\n font-family: PingFangSC-Regular;\n font-size: 24px;\n color: #616C73;\n font-weight: 400;\n}\n</style>\n\n<style scoped src=\"./colmo.css\"></style>\n<style scoped src=\"./diablo.css\"></style>\n"],"sourceRoot":""}]);
|
|
9036
9036
|
|
|
9037
9037
|
// exports
|
|
9038
9038
|
|
|
@@ -9270,7 +9270,7 @@ exports = module.exports = __webpack_require__(0)(true);
|
|
|
9270
9270
|
|
|
9271
9271
|
|
|
9272
9272
|
// module
|
|
9273
|
-
exports.push([module.i, "\n.indicator[data-v-7ecb2930] {\n position: absolute;\n item-color: rgba(255, 195, 0, .5);\n item-selected-color: #ffc300;\n item-size: 0.26667rem;\n height: 0.26667rem;\n bottom: 0.32rem;\n}\n.indicator .weex-indicator-item[data-v-7ecb2930] {\n width: 0.26667rem;\n height: 0.26667rem;\n}\n.indicator .weex-indicator-item.weex-indicator-item-active[data-v-7ecb2930] {\n background-color: #ffc300;\n}\n.indicator .weex-indicator-item[data-v-7ecb2930] {\n background-color: rgba(255, 195, 0, .5);\n}\n", "", {"version":3,"sources":["/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-lightbox/index.vue?25abe080","/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-lightbox/<input css
|
|
9273
|
+
exports.push([module.i, "\n.indicator[data-v-7ecb2930] {\n position: absolute;\n item-color: rgba(255, 195, 0, .5);\n item-selected-color: #ffc300;\n item-size: 0.26667rem;\n height: 0.26667rem;\n bottom: 0.32rem;\n}\n.indicator .weex-indicator-item[data-v-7ecb2930] {\n width: 0.26667rem;\n height: 0.26667rem;\n}\n.indicator .weex-indicator-item.weex-indicator-item-active[data-v-7ecb2930] {\n background-color: #ffc300;\n}\n.indicator .weex-indicator-item[data-v-7ecb2930] {\n background-color: rgba(255, 195, 0, .5);\n}\n", "", {"version":3,"sources":["/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-lightbox/index.vue?25abe080","/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-lightbox/<input css 15>","/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-lightbox/<input css 14>","/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-lightbox/<input css 13>"],"names":[],"mappings":";AA6BA;EACA,mBAAA;EACA,kCAAA;EACA,6BAAA;EACA,sBAAA;EACA,mBAAA;EACA,gBAAA;CACA;ACnCA;EACE,kBAAY;EACZ,mBAAa;CACd;ACHD;EACE,0BAA0B;CAC3B;ACFD;EACE,wCAAwC;CACzC","file":"index.vue","sourcesContent":["<template>\n <dof-mask :width=\"width\"\n :height=\"height\"\n aria-hidden=\"true\"\n mask-bg-color=\"transparent\"\n overlay-opacity=\"0.8\"\n :show=\"show\"\n :opacity='opacity'\n :show-close=\"false\"\n @dofMaskSetHidden=\"maskOverlayClick\">\n <slider auto-play=\"false\"\n v-if=\"show\"\n :index=\"index\"\n :interval=\"interval\"\n :style=\"{ height: height + 'px'}\">\n <div v-for=\"(v,index) in imageList\"\n :style=\"{ height: height + 'px'}\"\n :key=\"index\">\n <image resize=\"cover\"\n :src=\"v.src\"\n :style=\"{ height: height + 'px', width: width + 'px'}\"></image>\n </div>\n <indicator class=\"indicator\"\n :style=\"indicatorStyle\"></indicator>\n </slider>\n </dof-mask>\n</template>\n\n<style scoped>\n .indicator {\n position: absolute;\n item-color: rgba(255, 195, 0, .5);\n item-selected-color: #ffc300;\n item-size: 20px;\n height: 20px;\n bottom: 24px;\n }\n</style>\n\n<script>\n import DofMask from '../dof-mask';\n\n export default {\n components: {\n DofMask\n },\n props: {\n width: {\n type: [Number, String],\n default: 750\n },\n height: {\n type: [Number, String],\n default: 750\n },\n show: {\n type: Boolean,\n default: false\n },\n imageList: Array,\n indicatorColor: {\n type: Object,\n default: () => ({\n 'item-color': 'rgba(255, 195, 0, .5)',\n 'item-selected-color': '#ffc300',\n 'item-size': '20px'\n })\n },\n index: {\n type: [Number, String],\n default: 0\n },\n interval: {\n type: [Number, String],\n default: 3000\n },\n opacity: {\n type: [Number, String],\n default: 0.6\n }\n },\n computed: {\n indicatorStyle () {\n return {\n width: this.width + 'px',\n ...this.indicatorColor\n };\n }\n },\n methods: {\n maskOverlayClick () {\n this.$emit('dofLightboxOverlayClicked', {});\n }\n }\n };\n</script>\n","\n.indicator .weex-indicator-item {\n width: 20px;\n height: 20px;\n}","\n.indicator .weex-indicator-item.weex-indicator-item-active {\n background-color: #ffc300;\n}","\n.indicator .weex-indicator-item {\n background-color: rgba(255, 195, 0, .5);\n}"],"sourceRoot":""}]);
|
|
9274
9274
|
|
|
9275
9275
|
// exports
|
|
9276
9276
|
|
|
@@ -9648,7 +9648,7 @@ exports = module.exports = __webpack_require__(0)(true);
|
|
|
9648
9648
|
|
|
9649
9649
|
|
|
9650
9650
|
// module
|
|
9651
|
-
exports.push([module.i, "\n.indicator {\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 0.66667rem;\n item-color: rgba(255, 255, 255, 0.5);\n item-selectedcolor: rgba(255, 255, 255, 1);\n item-size: 0.18667rem;\n}\n.indicator .weex-indicator-item {\n width: 0.18667rem;\n height: 0.18667rem;\n}\n.indicator .weex-indicator-item {\n background-color: rgba(255, 255, 255, 0.5);\n}\n.slider {\n /* background-color: #f2f2f2; */\n /* margin-left: 32px; */\n border-radius: 0.21333rem;\n}\n.image {\n border-radius: 0.21333rem;\n /* background-color: #f2f2f2; */\n}\n.div_out {\n border-radius: 0.21333rem;\n position: relative;\n}\n", "", {"version":3,"sources":["/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-swiper/index.vue?3b03a1f1","/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-swiper/<input css
|
|
9651
|
+
exports.push([module.i, "\n.indicator {\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 0.66667rem;\n item-color: rgba(255, 255, 255, 0.5);\n item-selectedcolor: rgba(255, 255, 255, 1);\n item-size: 0.18667rem;\n}\n.indicator .weex-indicator-item {\n width: 0.18667rem;\n height: 0.18667rem;\n}\n.indicator .weex-indicator-item {\n background-color: rgba(255, 255, 255, 0.5);\n}\n.slider {\n /* background-color: #f2f2f2; */\n /* margin-left: 32px; */\n border-radius: 0.21333rem;\n}\n.image {\n border-radius: 0.21333rem;\n /* background-color: #f2f2f2; */\n}\n.div_out {\n border-radius: 0.21333rem;\n position: relative;\n}\n", "", {"version":3,"sources":["/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-swiper/index.vue?3b03a1f1","/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-swiper/<input css 17>","/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-swiper/<input css 16>"],"names":[],"mappings":";AAiCA;EACA,mBAAA;EACA,UAAA;EACA,QAAA;EACA,SAAA;EACA,mBAAA;EACA,qCAAA;EACA,2CAAA;EACA,sBAAA;CACA;ACzCA;EACE,kBAAY;EACZ,mBAAa;CACd;ACHD;EACE,2CAA2C;CAC5C;AFwCD;EACA,gCAAA;EACA,wBAAA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;EACA,gCAAA;CACA;AACA;EACA,0BAAA;EACA,mBAAA;CACA","file":"index.vue","sourcesContent":["<template>\n <div :style=\"{ marginLeft: divLeft, width: imgWidth }\" class=\"div_out\">\n <slider\n class=\"slider\"\n :style=\"sliderStyle\"\n :interval=\"interval\"\n @change=\"change\"\n :auto-play=\"autoplay\"\n :infinite=\"infinite\"\n >\n <div v-for=\"(item, index) in slItems\" :key=\"index\" @click=\"imgClicked(item, index)\">\n <image\n :resize=\"imgResize\"\n :style=\"{ width: imgWidth, height: imgHeight, backgroundColor: imageBgColor }\"\n :src=\"item.url\"\n :placeholder=\"phImgUrl\"\n class=\"image\"\n >\n </image>\n </div>\n <indicator class=\"indicator\" :style=\"indicatorStyle\" v-if=\"showIndicator && !_isColmo\"></indicator>\n </slider>\n <div class=\"indicator-box\" v-if=\"showIndicator && _isColmo\">\n <div\n :class=\"['indicator-item', i === slItems.length - 1 && 'isLast', i == active && 'active']\"\n v-for=\"(item, i) in slItems\"\n :key=\"i\"\n ></div>\n </div>\n </div>\n</template>\n\n<style>\n.indicator {\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 50px;\n item-color: rgba(255, 255, 255, 0.5);\n item-selectedcolor: rgba(255, 255, 255, 1);\n item-size: 14px;\n}\n.slider {\n /* background-color: #f2f2f2; */\n /* margin-left: 32px; */\n border-radius: 16px;\n}\n.image {\n border-radius: 16px;\n /* background-color: #f2f2f2; */\n}\n.div_out {\n border-radius: 16px;\n position: relative;\n}\n</style>\n<style scoped src=\"./colmo.css\"></style>\n\n<script>\nconst icon = require('../setting/icon.base64')\nvar PLACEHOLDERIMAGE = icon['ic_img_null@2x']\nconst modal = weex.requireModule('modal')\nimport ColmoMixin from '../../mixins/colmo'\n\nexport default {\n mixins: [ColmoMixin],\n props: {\n sliderStyle: {\n type: Object,\n default: () => ({\n width: '686px',\n height: '280px',\n position: 'relative'\n })\n },\n indicatorStyle: {\n type: Object,\n default: () => ({})\n },\n items: {\n type: Array,\n default: () => []\n },\n interval: {\n type: Number,\n default: 3000\n },\n autoplay: {\n type: Boolean,\n default: true\n },\n infinite: {\n type: Boolean,\n default: true\n },\n imgResize: {\n type: String,\n default: 'cover'\n },\n imgWidth: {\n type: String,\n default: '686px'\n },\n divLeft: {\n type: String,\n default: '32px'\n },\n imgHeight: {\n type: String,\n default: '280px'\n },\n showIndicator: {\n type: Boolean,\n default: true\n },\n phImgUrl: {\n type: String,\n default: PLACEHOLDERIMAGE\n },\n imageBgColor: {\n type: String,\n default: '#f2f2f2'\n }\n },\n data: function() {\n return {\n slItems: [],\n active: 0\n }\n },\n created() {\n if (this.items.length > 10) {\n this.slItems.splice(0)\n this.slItems = this.items.slice(0, 10)\n } else if (this.items.length <= 10) {\n this.slItems.splice(0)\n this.slItems = this.items.slice(0)\n }\n },\n methods: {\n imgClicked(target, index) {\n this.$emit('dofSwiperClicked', { target, index })\n },\n change(val) {\n this.active = val.index\n }\n }\n}\n</script>\n","\n.indicator .weex-indicator-item {\n width: 14px;\n height: 14px;\n}","\n.indicator .weex-indicator-item {\n background-color: rgba(255, 255, 255, 0.5);\n}"],"sourceRoot":""}]);
|
|
9652
9652
|
|
|
9653
9653
|
// exports
|
|
9654
9654
|
|
|
@@ -18718,6 +18718,7 @@ exports.default = {
|
|
|
18718
18718
|
computed: {
|
|
18719
18719
|
isipx: function isipx() {
|
|
18720
18720
|
if (this.bottomArc) return true;
|
|
18721
|
+
if (weex.config.env.platform == "harmony" && weex.config.env.safeAreaBottomHeight) return true;
|
|
18721
18722
|
return weex && (weex.config.env.deviceModel === 'iPhone10,3' || weex.config.env.deviceModel === 'iPhone10,6' || //iphoneX
|
|
18722
18723
|
weex.config.env.deviceModel === 'iPhone11,8' || //iPhone XR
|
|
18723
18724
|
weex.config.env.deviceModel === 'iPhone11,2' || //iPhone XS
|
|
@@ -24005,7 +24006,7 @@ exports.default = {
|
|
|
24005
24006
|
if (this.animationLock) {
|
|
24006
24007
|
return;
|
|
24007
24008
|
}
|
|
24008
|
-
if (this.hasAnimation) {
|
|
24009
|
+
if (this.hasAnimation && this.show) {
|
|
24009
24010
|
this.setAnimationLock();
|
|
24010
24011
|
var popoverEl = this.$refs['dof-popover'];
|
|
24011
24012
|
var coverEl = this.$refs['dof-cover'];
|