dolphin-weex-ui 2.2.1 → 2.2.2

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
@@ -8919,7 +8919,7 @@ exports = module.exports = __webpack_require__(0)(true);
8919
8919
 
8920
8920
 
8921
8921
  // module
8922
- exports.push([module.i, "\n.wrapper[data-v-722c555d] {\n /*hairong add for swipe*/\n overflow: hidden;\n position: relative;\n /* end by hairong*/\n /* 解决安卓渲染间隔问题 */\n /* margin-bottom: -1px; */\n /* padding-bottom: -1px; */\n}\n.fake-border[data-v-722c555d] {\n /* width: 750px; */\n height: 1px;\n position: absolute;\n bottom: 1px;\n left: 0;\n /* background-color: #f2f2f2; */\n}\n.cell-margin[data-v-722c555d] {\n margin-bottom: 0.21333rem;\n}\n.dof-cell-highlight[data-v-722c555d]:active {\n background-color: #f5f5f5;\n}\n.dof-cell[data-v-722c555d] {\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-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n /* align-items: center; */\n}\n.cell-wrapper[data-v-722c555d] {\n -webkit-box-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n}\n.mgb-1[data-v-722c555d] {\n margin-bottom: 1px;\n}\n.cell-disabled-opacity[data-v-722c555d] {\n opacity: 0.3;\n}\n.cell-abled-opacity[data-v-722c555d] {\n opacity: 1;\n}\n\n/* left部分 */\n.left[data-v-722c555d] {\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n /* border-width: 1px; */\n}\n.img-wrapper[data-v-722c555d] {\n}\n.circle-bg[data-v-722c555d] {\n margin-left: 0.42667rem;\n /* width: 96px;\n height: 96px; */\n display: -webkit-box;\n display: -webkit-flex;\n display: flex;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n overflow: hidden;\n}\n.text-dot-tip[data-v-722c555d] {\n width: 0.21333rem;\n height: 0.21333rem;\n border-radius: 0.13333rem;\n background-color: #ff3b30;\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n text-align: center;\n margin-left: 0.29333rem;\n}\n.dot-tip[data-v-722c555d] {\n position: absolute;\n top: 0.45333rem;\n right: 0px;\n width: 0.21333rem;\n height: 0.21333rem;\n border-radius: 0.13333rem;\n background-color: #ff3b30;\n}\n.dot-num-tip[data-v-722c555d] {\n position: absolute;\n font-size: 0.32rem;\n top: 0.45333rem;\n right: 0.21333rem;\n /* transform: translate(50%, 0); */\n border-radius: 1.33333rem;\n /* border-width: 1px;\n border-color: #ffffff; */\n background-color: #ff3b30;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n padding-left: 0.10667rem;\n padding-right: 0.10667rem;\n line-height: 1;\n}\n.dot-num-tip-text[data-v-722c555d] {\n font-size: 0.32rem;\n color: #ffffff;\n}\n.left-img[data-v-722c555d] {\n /* width: 64px;\n height: 64px; */\n}\n.main-container[data-v-722c555d] {\n -webkit-box-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n /* padding: 0 0px 0 32px; */\n margin-left: 0.42667rem;\n overflow: hidden;\n\n /* border-width: 1px;\n border-color: red; */\n}\n.Dotleft32[data-v-722c555d] {\n margin-left: 0.42667rem;\n}\n.Dotright32[data-v-722c555d] {\n margin-right: 0.42667rem;\n}\n.notDot[data-v-722c555d] {\n margin-left: 0px;\n}\n.dotRight[data-v-722c555d] {\n right: 0.42667rem;\n}\n\n/* label */\n.cell-label-text[data-v-722c555d] {\n font-size: 0.4rem;\n color: #666666;\n width: 2.50667rem;\n margin-right: 0.13333rem;\n}\n\n/* middle部分 */\n.middle[data-v-722c555d] {\n -webkit-box-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n min-height: 1.38667rem;\n overflow: hidden;\n /* margin-right: 32px; */\n /* border-width: 1px;\n border-color: blue; */\n}\n.has-desc[data-v-722c555d] {\n min-height: 2.13333rem;\n /* padding-top: 26px; */\n /* margin-bottom: 2px; */\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n}\n.no-desc[data-v-722c555d] {\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n}\n.cell-title-wrapper[data-v-722c555d] {\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n margin-right: 0.53333rem;\n overflow: hidden;\n}\n.cell-title-content[data-v-722c555d] {\n /* flex: 1; */\n /* max-width: 400px; */\n -webkit-box-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n -webkit-box-pack: stretch;\n -webkit-justify-content: stretch;\n justify-content: stretch;\n /* border-width: 1px;\n border-color: orange; */\n overflow: hidden;\n}\n.title-flex-expand[data-v-722c555d] {\n -webkit-box-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n}\n.cell-title[data-v-722c555d] {\n -webkit-box-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n /* justify-content: flex-start; */\n}\n.avatar-icon[data-v-722c555d] {\n width: 0.53333rem;\n height: 0.53333rem;\n border-radius: 0.26667rem;\n margin-right: 0.32rem;\n}\n.cell-title-text[data-v-722c555d] {\n font-family: PingFangSC-Regular;\n font-size: 0.42667rem;\n /* line-height: 32px; */\n color: #000000;\n lines: 1;\n text-overflow: ellipsis;\n overflow: hidden;\n overflow: hidden;\n text-overflow: ellipsis;\n -webkit-line-clamp: 1;\n}\n\n/* tag */\n.cell-title-tag[data-v-722c555d] {\n width: 1.17333rem;\n height: 0.64rem;\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n text-align: center;\n background-color: #f2f2f2;\n border-radius: 0.32rem;\n margin-left: 0.24rem;\n}\n.cell-title-tag-text[data-v-722c555d] {\n font-family: PingFangSC-Medium;\n font-size: 0.32rem;\n color: #666666;\n /* line-height: 24px; */\n}\n\n/* desc */\n.cell-desc-wrapper[data-v-722c555d] {\n /* flex: 1; */\n margin-top: 0.21333rem;\n /* border-width: 1px;\n border-color: tomato; */\n /* padding-bottom: 30px; */\n /* min-height: 36px; */\n}\n.margin-top-24[data-v-722c555d] {\n margin-top: 0.24rem;\n}\n.cell-desc[data-v-722c555d] {\n /* border-width: 1px;\n border-color: aqua; */\n}\n.cell-desc-text[data-v-722c555d] {\n font-family: PingFangSC-Regular;\n color: #8a8a8f;\n font-size: 0.32rem;\n /* line-height: 36px; */\n /* desc和title的间距 */\n /* margin-top: 4px; */\n /* margin-right: 30px; */\n /* 文字超出设置 */\n lines: 2;\n text-overflow: ellipsis;\n overflow: hidden;\n overflow: hidden;\n text-overflow: ellipsis;\n -webkit-line-clamp: 2;\n}\n\n/* 右部 */\n.right-tip-wrapper[data-v-722c555d] {\n padding: 0.53333rem 0.42667rem 0 0;\n /* border-width: 1px; */\n}\n.space-gap[data-v-722c555d] {\n margin-left: 1.22667rem;\n}\n.right-tip-text[data-v-722c555d] {\n font-family: PingFangSC-Regular;\n color: #8a8a8f;\n font-size: 0.32rem;\n /* line-height: 24px; */\n text-align: right;\n}\n.right[data-v-722c555d] {\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n padding-right: 0.42667rem;\n padding-left: 0.42667rem;\n}\n.has-no-padding-left[data-v-722c555d] {\n padding-right: 0;\n padding-left: 0;\n}\n.right-text-wrapper[data-v-722c555d] {\n /* 文字距离图标间隔 */\n /* margin-left: 80px;\n border-width: 1px;\n border-color: greenyellow; */\n}\n.right-text[data-v-722c555d] {\n font-family: PingFangSC-Regular;\n color: #666666;\n font-size: 0.37333rem;\n /* line-height: 28px; */\n letter-spacing: 0;\n text-align: right;\n}\n.normal-right-text[data-v-722c555d] {\n font-size: 0.42667rem;\n /* line-height: 32px; */\n}\n.single-line-text[data-v-722c555d] {\n /* color: #8a8a8f;\n font-size: 24px;\n line-height: 34px; */\n}\n\n/* arrow */\n.arrow-wrapper[data-v-722c555d] {\n padding-left: 0.26667rem;\n}\n.cell-arrow-icon[data-v-722c555d] {\n width: 0.29333rem;\n height: 0.29333rem;\n}\n.midea-swipe-cell__right[data-v-722c555d] {\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-flex-wrap: nowrap;\n flex-wrap: nowrap;\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n background-color: #ff3b30;\n font-size: 0.42667rem;\n color: #ffffff;\n}\n", "", {"version":3,"sources":["/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-cell/index.vue?7e2b09da","/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-cell/<no source>"],"names":[],"mappings":"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","file":"index.vue","sourcesContent":["<template>\n <div :class=\"['wrapper', hasMargin && 'cell-margin']\" ref=\"dof-cell\" :style=\"cellStyleComp\">\n <div :class=\"['cell-wrapper', disabled ? 'cell-disabled-opacity' : 'cell-abled-opacity']\">\n <div\n :class=\"['dof-cell', hackMrgb1pxcom && 'mgb-1', !disabled && isHighlight && 'dof-cell-highlight']\"\n :style=\"borderStyleComp\"\n :accessible=\"autoAccessible\"\n :aria-label=\"`${label},${title},${desc}`\"\n @click=\"onClick\"\n >\n <slot>\n <!-- left -->\n <div class=\"left img-wrapper\" v-if=\"avatarIcon || avatarIconFont\">\n <div\n v-if=\"avatarIcon\"\n class=\"img-container circle-bg\"\n :class=\"[badgeNum && 'Dotright32']\"\n :style=\"avatarIconBgSizeComp\"\n >\n <slot name=\"leftImg\">\n <image class=\"left-img\" :src=\"avatarIcon\" :style=\"avatarIconSizeComp\"></image>\n </slot>\n </div>\n <div v-if=\"avatarIconFont\" class=\"circle-bg\">\n <slot name=\"leftIconFont\">\n <dof-iconfont\n :code=\"avatarIconFont\"\n :size=\"avatarIconFontSize\"\n :color=\"_isColmo ? 'rgba(255,255,255,0.80)' : '#333333'\"\n ></dof-iconfont>\n </slot>\n </div>\n\n <div class=\"dot-tip\" v-if=\"hasDot\" :class=\"[badgeNum && 'dotRight']\" :style=\"badgeStyle\"></div>\n <div class=\"dot-num-tip\" v-else-if=\"badgeNum\" :style=\"badgeStyle\">\n <text class=\"dot-num-tip-text\">{{ dotNum }}</text>\n </div>\n </div>\n\n <!-- middle -->\n <div\n :class=\"['main-container', hasVerticalIndent && 'cell-indent', badgeNum && 'notDot']\"\n :style=\"subBorderStyleComp\"\n >\n <slot name=\"label\">\n <div v-if=\"label\">\n <text class=\"cell-label-text\" :style=\"textColorComp\">{{ label }}</text>\n </div>\n </slot>\n <div :class=\"['middle', desc ? 'has-desc' : 'no-desc']\" :style=\"innerCellHeightComp\">\n <slot name=\"middle\">\n <div class=\"cell-title-wrapper\">\n <div :class=\"['cell-title-content', !tag && 'title-flex-expand']\">\n <div :class=\"['cell-title']\">\n <text :class=\"['cell-title-text', !hasTextTip && 'title-flex-expand']\" :style=\"titleStyleComp\">{{\n title\n }}</text>\n <div class=\"text-dot-tip\" v-if=\"hasTextTip\"></div>\n </div>\n </div>\n\n <slot name=\"tag\">\n <div\n class=\"cell-title-tag\"\n v-if=\"tag\"\n :style=\"{\n backgroundColor: iconColor ? iconColor : '#f2f2f2'\n }\"\n >\n <text class=\"cell-title-tag-text\">{{ tag }}</text>\n </div>\n </slot>\n </div>\n <div :class=\"['cell-desc-wrapper', !tag && !_isColmo && 'margin-top-24']\" v-if=\"desc\">\n <slot name=\"desc\">\n <div class=\"cell-desc\">\n <text class=\"cell-desc-text\" :style=\"descStyleComp\">{{ desc }}</text>\n </div>\n </slot>\n </div>\n </slot>\n </div>\n <!-- right -->\n <div :class=\"['right', rightTip && 'has-no-padding-left']\">\n <slot name=\"rightText\">\n <div class=\"right-text-wrapper\" v-if=\"rightText\">\n <text\n :class=\"[\n 'right-text',\n !avatarIcon && 'single-line-text',\n avatarIcon && iconSize === 'big' && 'normal-right-text'\n ]\"\n :style=\"rightTextStyleComp\"\n >{{ rightText }}</text\n >\n </div>\n </slot>\n <text class=\"extra-content-text\" :style=\"textColorComp\" v-if=\"extraContent\">{{ extraContent }}</text>\n <!-- 开关 -->\n <slot name=\"switch\"></slot>\n\n <div class=\"arrow-wrapper\" v-if=\"hasArrow\">\n <slot name=\"arrow\">\n <dof-iconfont\n style=\"width: 34px\"\n v-if=\"_isColmo\"\n :code=\"'\\u4713'\"\n :size=\"48\"\n :color=\"'rgba(255,255,255,0.80)'\"\n ></dof-iconfont>\n <image v-else :src=\"arrowIcon\" class=\"cell-arrow-icon\" :aria-hidden=\"true\"></image>\n </slot>\n </div>\n </div>\n </div>\n <div\n :class=\"[\n 'right-tip-wrapper',\n hasTopSubBorder && 'cell-top-border',\n hasSubBottomBorder && 'cell-bottom-border',\n special && 'space-gap'\n ]\"\n v-if=\"rightTip\"\n >\n <slot name=\"rightTip\">\n <text class=\"right-tip-text\" @click=\"dofRightTipClicked\">{{ rightTip }}</text>\n </slot>\n </div>\n </slot>\n </div>\n </div>\n <div v-if=\"useFakeBorder\" class=\"fake-border\" :style=\"fakeBorderStyleRender\"></div>\n </div>\n</template>\n\n<style scoped>\n.wrapper {\n /*hairong add for swipe*/\n overflow: hidden;\n position: relative;\n /* end by hairong*/\n /* 解决安卓渲染间隔问题 */\n /* margin-bottom: -1px; */\n /* padding-bottom: -1px; */\n}\n\n.fake-border {\n /* width: 750px; */\n height: 1px;\n position: absolute;\n bottom: 1px;\n left: 0;\n /* background-color: #f2f2f2; */\n}\n\n.cell-margin {\n margin-bottom: 16px;\n}\n\n.dof-cell-highlight:active {\n background-color: #f5f5f5;\n}\n\n.dof-cell {\n display: flex;\n flex-direction: row;\n flex: 1;\n /* align-items: center; */\n}\n.cell-wrapper {\n flex: 1;\n}\n\n.mgb-1 {\n margin-bottom: 1px;\n}\n\n.cell-disabled-opacity {\n opacity: 0.3;\n}\n\n.cell-abled-opacity {\n opacity: 1;\n}\n\n/* left部分 */\n.left {\n justify-content: center;\n /* border-width: 1px; */\n}\n\n.img-wrapper {\n}\n\n.circle-bg {\n margin-left: 32px;\n /* width: 96px;\n height: 96px; */\n display: flex;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n}\n\n.text-dot-tip {\n width: 16px;\n height: 16px;\n border-radius: 10px;\n background-color: #ff3b30;\n justify-content: center;\n align-items: center;\n text-align: center;\n margin-left: 22px;\n}\n\n.dot-tip {\n position: absolute;\n top: 34px;\n right: 0px;\n width: 16px;\n height: 16px;\n border-radius: 10px;\n background-color: #ff3b30;\n}\n\n.dot-num-tip {\n position: absolute;\n font-size: 24px;\n top: 34px;\n right: 16px;\n /* transform: translate(50%, 0); */\n border-radius: 100px;\n /* border-width: 1px;\n border-color: #ffffff; */\n background-color: #ff3b30;\n align-items: center;\n justify-content: center;\n padding-left: 8px;\n padding-right: 8px;\n line-height: 1;\n}\n\n.dot-num-tip-text {\n font-size: 24px;\n color: #ffffff;\n}\n\n.left-img {\n /* width: 64px;\n height: 64px; */\n}\n\n.main-container {\n flex: 1;\n flex-direction: row;\n align-items: center;\n /* padding: 0 0px 0 32px; */\n margin-left: 32px;\n overflow: hidden;\n\n /* border-width: 1px;\n border-color: red; */\n}\n\n.Dotleft32 {\n margin-left: 32px;\n}\n\n.Dotright32 {\n margin-right: 32px;\n}\n\n.notDot {\n margin-left: 0px;\n}\n\n.dotRight {\n right: 32px;\n}\n\n/* label */\n.cell-label-text {\n font-size: 30px;\n color: #666666;\n width: 188px;\n margin-right: 10px;\n}\n\n/* middle部分 */\n.middle {\n flex: 1;\n min-height: 104px;\n overflow: hidden;\n /* margin-right: 32px; */\n /* border-width: 1px;\n border-color: blue; */\n}\n\n.has-desc {\n min-height: 160px;\n /* padding-top: 26px; */\n /* margin-bottom: 2px; */\n justify-content: center;\n}\n\n.no-desc {\n justify-content: center;\n}\n\n.cell-title-wrapper {\n flex-direction: row;\n margin-right: 40px;\n overflow: hidden;\n}\n\n.cell-title-content {\n /* flex: 1; */\n /* max-width: 400px; */\n flex: 1;\n flex-direction: row;\n align-items: center;\n justify-content: stretch;\n /* border-width: 1px;\n border-color: orange; */\n overflow: hidden;\n}\n\n.title-flex-expand {\n flex: 1;\n}\n\n.cell-title {\n flex: 1;\n flex-direction: row;\n align-items: center;\n /* justify-content: flex-start; */\n}\n\n.avatar-icon {\n width: 40px;\n height: 40px;\n border-radius: 20px;\n margin-right: 24px;\n}\n\n.cell-title-text {\n font-family: PingFangSC-Regular;\n font-size: 32px;\n /* line-height: 32px; */\n color: #000000;\n lines: 1;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n\n/* tag */\n\n.cell-title-tag {\n width: 88px;\n height: 48px;\n justify-content: center;\n align-items: center;\n text-align: center;\n background-color: #f2f2f2;\n border-radius: 24px;\n margin-left: 18px;\n}\n\n.cell-title-tag-text {\n font-family: PingFangSC-Medium;\n font-size: 24px;\n color: #666666;\n /* line-height: 24px; */\n}\n\n/* desc */\n.cell-desc-wrapper {\n /* flex: 1; */\n margin-top: 16px;\n /* border-width: 1px;\n border-color: tomato; */\n /* padding-bottom: 30px; */\n /* min-height: 36px; */\n}\n\n.margin-top-24 {\n margin-top: 18px;\n}\n\n.cell-desc {\n /* border-width: 1px;\n border-color: aqua; */\n}\n\n.cell-desc-text {\n font-family: PingFangSC-Regular;\n color: #8a8a8f;\n font-size: 24px;\n /* line-height: 36px; */\n /* desc和title的间距 */\n /* margin-top: 4px; */\n /* margin-right: 30px; */\n /* 文字超出设置 */\n lines: 2;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n\n/* 右部 */\n.right-tip-wrapper {\n padding: 40px 32px 0 0;\n /* border-width: 1px; */\n}\n\n.space-gap {\n margin-left: 92px;\n}\n\n.right-tip-text {\n font-family: PingFangSC-Regular;\n color: #8a8a8f;\n font-size: 24px;\n /* line-height: 24px; */\n text-align: right;\n}\n\n.right {\n flex-direction: row;\n align-items: center;\n padding-right: 32px;\n padding-left: 32px;\n}\n\n.has-no-padding-left {\n padding-right: 0;\n padding-left: 0;\n}\n\n.right-text-wrapper {\n /* 文字距离图标间隔 */\n /* margin-left: 80px;\n border-width: 1px;\n border-color: greenyellow; */\n}\n\n.right-text {\n font-family: PingFangSC-Regular;\n color: #666666;\n font-size: 28px;\n /* line-height: 28px; */\n letter-spacing: 0;\n text-align: right;\n}\n\n.normal-right-text {\n font-size: 32px;\n /* line-height: 32px; */\n}\n\n.single-line-text {\n /* color: #8a8a8f;\n font-size: 24px;\n line-height: 34px; */\n}\n\n/* arrow */\n.arrow-wrapper {\n padding-left: 20px;\n}\n\n.cell-arrow-icon {\n width: 22px;\n height: 22px;\n}\n\n.midea-swipe-cell__right {\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n justify-content: center;\n align-items: center;\n background-color: #ff3b30;\n font-size: 32px;\n color: #ffffff;\n}\n</style>\n<style scoped src=\"./colmo.css\"></style>\n\n<script>\nconst icon = require('../setting/icon.base64.js')\nconst modal = weex.requireModule('modal')\nconst dom = weex.requireModule('dom')\nimport DofIconfont from '../dof-iconfont'\nimport ColmoMixin from '../../mixins/colmo'\nexport default {\n mixins: [ColmoMixin],\n components: { DofIconfont },\n props: {\n special: {\n type: Boolean,\n default: false\n },\n label: {\n type: String,\n default: ''\n },\n isHighlight: {\n type: Boolean,\n default: true\n },\n title: {\n type: String,\n default: ''\n },\n tag: {\n type: String,\n default: ''\n },\n extraContent: {\n type: String,\n default: ''\n },\n desc: {\n type: String,\n default: ''\n },\n hasTextTip: {\n type: Boolean,\n default: false\n },\n badgeNum: {\n type: [Number, String],\n default: 0\n },\n badgeMax: {\n type: Number,\n default: 0\n },\n badgeTheme: {\n type: String,\n default: 'red'\n },\n badgeColor: {\n type: String,\n default: ''\n },\n hasDot: {\n type: Boolean,\n default: false\n },\n avatarIcon: {\n type: String,\n default: ''\n },\n // 使用字体图标\n avatarIconFont: {\n type: String,\n default: ''\n },\n iconSize: {\n type: String,\n default: 'big'\n },\n iconSizeCustom: {\n // { iconSize: 96, bgSize: 96 }\n type: Object,\n default: () => ({})\n },\n cellStyle: {\n type: Object,\n default: () => ({})\n },\n rightTextStyle: {\n type: Object,\n default: () => ({})\n },\n backgroundColor: {\n type: String,\n default: ''\n },\n textColor: {\n type: String,\n default: ''\n },\n iconColor: {\n type: String,\n default: ''\n },\n hasTopBorder: {\n type: Boolean,\n default: false\n },\n hasTopSubBorder: {\n type: Boolean,\n default: false\n },\n hasBottomBorder: {\n type: Boolean,\n default: false\n },\n hasSubTopBorder: {\n type: Boolean,\n default: false\n },\n hasSubBottomBorder: {\n type: Boolean,\n default: false\n },\n hasMargin: {\n type: Boolean,\n default: false\n },\n hasVerticalIndent: {\n type: Boolean,\n default: true\n },\n hasArrow: {\n type: Boolean,\n default: true\n },\n rightText: {\n type: String,\n default: ''\n },\n rightTip: {\n type: String,\n default: ''\n },\n disabled: {\n type: Boolean,\n default: false\n },\n autoAccessible: {\n type: Boolean,\n default: true\n },\n fakeBorderStyle: {\n type: Object,\n default: () => ({})\n },\n titleTextStyle: {\n type: Object,\n default: () => ({})\n },\n descTextStyle: {\n type: Object,\n default: () => ({})\n }\n },\n data: () => ({\n arrowIcon: icon.arrowIconNew,\n offset: 0,\n dragging: false,\n badgeThemeList: {\n brand: '#267aff',\n red: '#ff3b30',\n purple: '#995efc',\n 'blue-purple': '#6575ff',\n blue: '#29c3ff',\n cyan: '#00cbb8',\n yellow: '#ffaa10',\n orange: '#ff8225',\n 'orange-red': '#ff6a4c',\n 'gray-offline': '#7c879b'\n }\n }),\n\n computed: {\n _backgroundColor() {\n if (this.backgroundColor) return this.backgroundColor\n return this._isColmo ? '#1d1f22' : '#ffffff'\n },\n _borderColor() {\n return this._isColmo ? '#343639' : '#f2f2f2'\n },\n useFakeBorder() {\n return JSON.stringify(this.fakeBorderStyle) !== '{}'\n },\n // cell样式\n cellStyleComp() {\n const { cellStyle, _backgroundColor } = this\n return {\n backgroundColor: _backgroundColor,\n ...cellStyle\n }\n },\n dotNum() {\n let { badgeNum, badgeMax } = this\n let value = ''\n let curContent = Number(badgeNum)\n if (badgeMax && curContent >= badgeMax) {\n value = `${badgeMax}+`\n } else {\n value = badgeNum\n }\n return value\n },\n //处理特殊类型cell高度问题\n innerCellHeightComp() {\n const { special, desc } = this\n if (special && desc) {\n return {\n minHeight: '200px',\n paddingTop: '32px'\n }\n }\n return ''\n },\n // 文字样式颜色\n textColorComp() {\n const { textColor } = this\n if (textColor) {\n return {\n color: textColor\n }\n } else {\n return {}\n }\n },\n titleStyleComp() {\n const { textColor, titleTextStyle } = this\n if (textColor) {\n return {\n color: textColor,\n ...titleTextStyle\n }\n } else {\n return {\n ...titleTextStyle\n }\n }\n },\n descStyleComp() {\n const { textColor, descTextStyle } = this\n if (textColor) {\n return {\n color: textColor,\n ...descTextStyle\n }\n } else {\n return {\n ...descTextStyle\n }\n }\n },\n avatarIconBgSizeComp() {\n let { iconSize, iconColor } = this\n let iconSizeCustom = this.iconSizeCustom.bgSize\n if (iconSizeCustom) {\n return {\n width: iconSizeCustom + 'px',\n height: iconSizeCustom + 'px',\n borderRadius: iconSizeCustom / 2 + 'px',\n backgroundColor: iconColor ? iconColor : 'transparent'\n }\n }\n if (iconSize === 'max') {\n return {\n width: '112px',\n height: '112px',\n borderRadius: '56px',\n backgroundColor: iconColor ? iconColor : 'transparent'\n }\n } else if (iconSize === 'medium') {\n return {\n width: '76px',\n height: '76px',\n borderRadius: '38px',\n backgroundColor: iconColor ? iconColor : 'transparent'\n }\n } else if (iconSize === 'min') {\n return {\n width: '40px',\n height: '40px',\n borderRadius: '20px',\n backgroundColor: iconColor ? iconColor : 'transparent'\n }\n } else {\n return {\n width: '64px',\n height: '64px',\n borderRadius: '32px',\n backgroundColor: iconColor ? iconColor : 'transparent'\n }\n }\n },\n avatarIconSizeComp() {\n let { iconSize } = this\n let iconSizeCustom = this.iconSizeCustom.iconSize\n if (iconSizeCustom) {\n return {\n width: iconSizeCustom + 'px',\n height: iconSizeCustom + 'px',\n borderRadius: iconSizeCustom / 2 + 'px'\n }\n }\n if (iconSize === 'max') {\n return {\n width: '96px',\n height: '96px'\n }\n } else if (iconSize === 'medium') {\n return {\n width: '64px',\n height: '64px'\n }\n } else if (iconSize === 'min') {\n return {\n width: '24px',\n height: '24px'\n }\n } else {\n return {\n width: '48px',\n height: '48px'\n }\n }\n },\n avatarIconFontSize() {\n let { iconSize } = this\n if (iconSize === 'max') {\n return 80\n } else if (iconSize === 'medium') {\n return 40\n } else if (iconSize === 'min') {\n return 24\n } else {\n return 64\n }\n },\n rightTextStyleComp() {\n const { textColor, rightTextStyle, avatarIcon, iconSize } = this\n if (textColor) {\n return {\n color: textColor,\n ...rightTextStyle\n }\n } else {\n return {\n ...rightTextStyle\n }\n }\n },\n hackMrgb1pxcom() {\n let { hasSubBottomBorder, hasBottomBorder } = this\n return hasSubBottomBorder || hasBottomBorder ? true : false\n },\n borderStyleComp() {\n let {\n cellStyle: { borderColor = null },\n hasTopBorder,\n hasBottomBorder\n } = this\n if (borderColor) {\n if (hasTopBorder) {\n return {\n borderTopWidth: '1px',\n borderTopColor: borderColor\n }\n } else if (hasBottomBorder) {\n return {\n borderBottomWidth: '1px',\n borderBottomColor: borderColor\n }\n } else {\n return {}\n }\n } else {\n if (hasTopBorder) {\n return {\n borderTopWidth: '1px',\n borderTopColor: this._borderColor\n }\n } else if (hasBottomBorder) {\n return {\n borderBottomWidth: '1px',\n borderBottomColor: this._borderColor\n }\n } else {\n return {}\n }\n }\n },\n subBorderStyleComp() {\n let {\n cellStyle: { borderColor = null },\n hasSubTopBorder,\n hasSubBottomBorder\n } = this\n if (borderColor) {\n if (hasSubTopBorder) {\n return {\n borderTopWidth: '1px',\n borderTopColor: borderColor\n }\n } else if (hasSubBottomBorder) {\n return {\n borderBottomWidth: '1px',\n borderBottomColor: borderColor\n }\n } else {\n return {}\n }\n } else {\n if (hasSubTopBorder) {\n return {\n borderTopWidth: '1px',\n borderTopColor: this._borderColor\n }\n } else if (hasSubBottomBorder) {\n return {\n borderBottomWidth: '1px',\n borderBottomColor: this._borderColor\n }\n } else {\n return {}\n }\n }\n },\n badgeStyle() {\n let { badgeTheme, badgeThemeList, badgeColor } = this\n return {\n backgroundColor: badgeColor ? badgeColor : badgeThemeList[badgeTheme]\n }\n },\n // 底部border样式\n fakeBorderStyleRender() {\n return {\n backgroundColor: this._isColmo ? '#343639' : '#F2F2F2',\n ...this.fakeBorderStyle\n }\n }\n },\n methods: {\n onClick() {\n const { disabled } = this\n !disabled && this.$emit('dofCellClicked')\n },\n dofRightTipClicked() {\n const { rightTip } = this\n rightTip && this.$emit('dofRightTipClicked')\n }\n }\n}\n</script>\n",null],"sourceRoot":""}]);
8922
+ exports.push([module.i, "\n.wrapper[data-v-722c555d] {\n /*hairong add for swipe*/\n overflow: hidden;\n position: relative;\n /* end by hairong*/\n /* 解决安卓渲染间隔问题 */\n /* margin-bottom: -1px; */\n /* padding-bottom: -1px; */\n}\n.fake-border[data-v-722c555d] {\n /* width: 750px; */\n height: 1px;\n position: absolute;\n bottom: 1px;\n left: 0;\n /* background-color: #f2f2f2; */\n}\n.cell-margin[data-v-722c555d] {\n margin-bottom: 0.21333rem;\n}\n.dof-cell-highlight[data-v-722c555d]:active {\n background-color: #f5f5f5;\n}\n.dof-cell[data-v-722c555d] {\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-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n /* align-items: center; */\n}\n.cell-wrapper[data-v-722c555d] {\n -webkit-box-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n}\n.mgb-1[data-v-722c555d] {\n margin-bottom: 1px;\n}\n.cell-disabled-opacity[data-v-722c555d] {\n opacity: 0.3;\n}\n.cell-abled-opacity[data-v-722c555d] {\n opacity: 1;\n}\n\n/* left部分 */\n.left[data-v-722c555d] {\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n /* border-width: 1px; */\n}\n.img-wrapper[data-v-722c555d] {\n}\n.circle-bg[data-v-722c555d] {\n margin-left: 0.42667rem;\n /* width: 96px;\n height: 96px; */\n display: -webkit-box;\n display: -webkit-flex;\n display: flex;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n overflow: hidden;\n}\n.text-dot-tip[data-v-722c555d] {\n width: 0.21333rem;\n height: 0.21333rem;\n border-radius: 0.13333rem;\n background-color: #ff3b30;\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n text-align: center;\n margin-left: 0.29333rem;\n}\n.dot-tip[data-v-722c555d] {\n position: absolute;\n top: 0.45333rem;\n right: 0px;\n width: 0.21333rem;\n height: 0.21333rem;\n border-radius: 0.13333rem;\n background-color: #ff3b30;\n}\n.dot-num-tip[data-v-722c555d] {\n position: absolute;\n font-size: 0.32rem;\n top: 0.45333rem;\n right: 0.21333rem;\n /* transform: translate(50%, 0); */\n border-radius: 1.33333rem;\n /* border-width: 1px;\n border-color: #ffffff; */\n background-color: #ff3b30;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n padding-left: 0.10667rem;\n padding-right: 0.10667rem;\n line-height: 1;\n}\n.dot-num-tip-text[data-v-722c555d] {\n font-size: 0.32rem;\n color: #ffffff;\n}\n.left-img[data-v-722c555d] {\n /* width: 64px;\n height: 64px; */\n}\n.main-container[data-v-722c555d] {\n -webkit-box-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n /* padding: 0 0px 0 32px; */\n margin-left: 0.42667rem;\n overflow: hidden;\n\n /* border-width: 1px;\n border-color: red; */\n}\n.Dotleft32[data-v-722c555d] {\n margin-left: 0.42667rem;\n}\n.Dotright32[data-v-722c555d] {\n margin-right: 0.42667rem;\n}\n.notDot[data-v-722c555d] {\n margin-left: 0px;\n}\n.dotRight[data-v-722c555d] {\n right: 0.42667rem;\n}\n\n/* label */\n.cell-label-text[data-v-722c555d] {\n font-size: 0.4rem;\n color: #666666;\n width: 2.50667rem;\n margin-right: 0.13333rem;\n}\n\n/* middle部分 */\n.middle[data-v-722c555d] {\n -webkit-box-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n min-height: 1.38667rem;\n overflow: hidden;\n /* margin-right: 32px; */\n /* border-width: 1px;\n border-color: blue; */\n}\n.has-desc[data-v-722c555d] {\n min-height: 2.13333rem;\n /* padding-top: 26px; */\n /* margin-bottom: 2px; */\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n}\n.no-desc[data-v-722c555d] {\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n}\n.cell-title-wrapper[data-v-722c555d] {\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n margin-right: 0.53333rem;\n overflow: hidden;\n}\n.cell-title-content[data-v-722c555d] {\n /* flex: 1; */\n /* max-width: 400px; */\n -webkit-box-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n -webkit-box-pack: stretch;\n -webkit-justify-content: stretch;\n justify-content: stretch;\n /* border-width: 1px;\n border-color: orange; */\n overflow: hidden;\n}\n.title-flex-expand[data-v-722c555d] {\n -webkit-box-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n}\n.cell-title[data-v-722c555d] {\n -webkit-box-flex: 1;\n -webkit-flex: 1;\n flex: 1;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n /* justify-content: flex-start; */\n}\n.avatar-icon[data-v-722c555d] {\n width: 0.53333rem;\n height: 0.53333rem;\n border-radius: 0.26667rem;\n margin-right: 0.32rem;\n}\n.cell-title-text[data-v-722c555d] {\n font-family: PingFangSC-Regular;\n font-size: 0.42667rem;\n /* line-height: 32px; */\n color: #000000;\n lines: 1;\n text-overflow: ellipsis;\n overflow: hidden;\n overflow: hidden;\n text-overflow: ellipsis;\n -webkit-line-clamp: 1;\n}\n\n/* tag */\n.cell-title-tag[data-v-722c555d] {\n width: 1.17333rem;\n height: 0.64rem;\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n text-align: center;\n background-color: #f2f2f2;\n border-radius: 0.32rem;\n margin-left: 0.24rem;\n}\n.cell-title-tag-text[data-v-722c555d] {\n font-family: PingFangSC-Medium;\n font-size: 0.32rem;\n color: #666666;\n /* line-height: 24px; */\n}\n\n/* desc */\n.cell-desc-wrapper[data-v-722c555d] {\n /* flex: 1; */\n margin-top: 0.21333rem;\n /* border-width: 1px;\n border-color: tomato; */\n /* padding-bottom: 30px; */\n /* min-height: 36px; */\n}\n.margin-top-24[data-v-722c555d] {\n margin-top: 0.24rem;\n}\n.cell-desc[data-v-722c555d] {\n /* border-width: 1px;\n border-color: aqua; */\n}\n.cell-desc-text[data-v-722c555d] {\n font-family: PingFangSC-Regular;\n color: #8a8a8f;\n font-size: 0.32rem;\n /* line-height: 36px; */\n /* desc和title的间距 */\n /* margin-top: 4px; */\n /* margin-right: 30px; */\n /* 文字超出设置 */\n lines: 2;\n text-overflow: ellipsis;\n overflow: hidden;\n overflow: hidden;\n text-overflow: ellipsis;\n -webkit-line-clamp: 2;\n}\n\n/* 右部 */\n.right-tip-wrapper[data-v-722c555d] {\n padding: 0.53333rem 0.42667rem 0 0;\n /* border-width: 1px; */\n}\n.space-gap[data-v-722c555d] {\n margin-left: 1.22667rem;\n}\n.right-tip-text[data-v-722c555d] {\n font-family: PingFangSC-Regular;\n color: #8a8a8f;\n font-size: 0.32rem;\n /* line-height: 24px; */\n text-align: right;\n}\n.right[data-v-722c555d] {\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n padding-right: 0.42667rem;\n padding-left: 0.42667rem;\n}\n.has-no-padding-left[data-v-722c555d] {\n padding-right: 0;\n padding-left: 0;\n}\n.right-text-wrapper[data-v-722c555d] {\n /* 文字距离图标间隔 */\n /* margin-left: 80px;\n border-width: 1px;\n border-color: greenyellow; */\n}\n.right-text[data-v-722c555d] {\n font-family: PingFangSC-Regular;\n color: #666666;\n font-size: 0.37333rem;\n /* line-height: 28px; */\n letter-spacing: 0;\n text-align: right;\n}\n.normal-right-text[data-v-722c555d] {\n font-size: 0.42667rem;\n /* line-height: 32px; */\n}\n.single-line-text[data-v-722c555d] {\n /* color: #8a8a8f;\n font-size: 24px;\n line-height: 34px; */\n}\n\n/* arrow */\n.arrow-wrapper[data-v-722c555d] {\n padding-left: 0.26667rem;\n}\n.cell-arrow-icon[data-v-722c555d] {\n width: 0.29333rem;\n height: 0.29333rem;\n}\n.midea-swipe-cell__right[data-v-722c555d] {\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-flex-wrap: nowrap;\n flex-wrap: nowrap;\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n background-color: #ff3b30;\n font-size: 0.42667rem;\n color: #ffffff;\n}\n", "", {"version":3,"sources":["/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-cell/index.vue?aa421c5c","/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-cell/<no source>"],"names":[],"mappings":"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","file":"index.vue","sourcesContent":["<template>\n <div :class=\"['wrapper', hasMargin && 'cell-margin']\" ref=\"dof-cell\" :style=\"cellStyleComp\">\n <div :class=\"['cell-wrapper', disabled ? 'cell-disabled-opacity' : 'cell-abled-opacity']\">\n <div\n :class=\"['dof-cell', hackMrgb1pxcom && 'mgb-1', !disabled && isHighlight && 'dof-cell-highlight']\"\n :style=\"borderStyleComp\"\n :accessible=\"autoAccessible\"\n :aria-label=\"`${label},${title},${desc}`\"\n @click=\"onClick\"\n >\n <slot>\n <!-- left -->\n <div class=\"left img-wrapper\" v-if=\"avatarIcon || avatarIconFont\">\n <div\n v-if=\"avatarIcon\"\n class=\"img-container circle-bg\"\n :class=\"[badgeNum && 'Dotright32']\"\n :style=\"avatarIconBgSizeComp\"\n >\n <slot name=\"leftImg\">\n <image class=\"left-img\" :src=\"avatarIcon\" :style=\"avatarIconSizeComp\"></image>\n </slot>\n </div>\n <div v-if=\"avatarIconFont\" class=\"circle-bg\">\n <slot name=\"leftIconFont\">\n <dof-iconfont\n :code=\"avatarIconFont\"\n :size=\"avatarIconFontSize\"\n :color=\"_isColmo ? 'rgba(255,255,255,0.80)' : '#333333'\"\n ></dof-iconfont>\n </slot>\n </div>\n\n <div class=\"dot-tip\" v-if=\"hasDot\" :class=\"[badgeNum && 'dotRight']\" :style=\"badgeStyle\"></div>\n <div class=\"dot-num-tip\" v-else-if=\"badgeNum\" :style=\"badgeStyle\">\n <text class=\"dot-num-tip-text\">{{ dotNum }}</text>\n </div>\n </div>\n\n <!-- middle -->\n <div\n :class=\"['main-container', hasVerticalIndent && 'cell-indent', badgeNum && 'notDot']\"\n :style=\"subBorderStyleComp\"\n >\n <slot name=\"label\">\n <div v-if=\"label\">\n <text class=\"cell-label-text\" :style=\"textColorComp\">{{ label }}</text>\n </div>\n </slot>\n <div :class=\"['middle', desc ? 'has-desc' : 'no-desc']\" :style=\"innerCellHeightComp\">\n <slot name=\"middle\">\n <div class=\"cell-title-wrapper\">\n <div :class=\"['cell-title-content', !tag && 'title-flex-expand']\">\n <div :class=\"['cell-title']\">\n <text :class=\"['cell-title-text', !hasTextTip && 'title-flex-expand']\" :style=\"titleStyleComp\">{{\n title\n }}</text>\n <div class=\"text-dot-tip\" v-if=\"hasTextTip\"></div>\n </div>\n </div>\n\n <slot name=\"tag\">\n <div\n class=\"cell-title-tag\"\n v-if=\"tag\"\n :style=\"{\n backgroundColor: iconColor ? iconColor : '#f2f2f2'\n }\"\n >\n <text class=\"cell-title-tag-text\">{{ tag }}</text>\n </div>\n </slot>\n </div>\n <div :class=\"['cell-desc-wrapper', !tag && !_isColmo && 'margin-top-24']\" v-if=\"desc\">\n <slot name=\"desc\">\n <div class=\"cell-desc\">\n <text class=\"cell-desc-text\" :style=\"descStyleComp\">{{ desc }}</text>\n </div>\n </slot>\n </div>\n </slot>\n </div>\n <!-- right -->\n <div :class=\"['right', rightTip && 'has-no-padding-left']\">\n <slot name=\"rightText\">\n <div class=\"right-text-wrapper\" v-if=\"rightText\">\n <text\n :class=\"[\n 'right-text',\n !avatarIcon && 'single-line-text',\n avatarIcon && iconSize === 'big' && 'normal-right-text'\n ]\"\n :style=\"rightTextStyleComp\"\n >{{ rightText }}</text\n >\n </div>\n </slot>\n <text class=\"extra-content-text\" :style=\"textColorComp\" v-if=\"extraContent\">{{ extraContent }}</text>\n <!-- 开关 -->\n <slot name=\"switch\"></slot>\n\n <div class=\"arrow-wrapper\" v-if=\"hasArrow\">\n <slot name=\"arrow\">\n <dof-iconfont\n style=\"width: 34px\"\n v-if=\"_isColmo\"\n :code=\"'\\u4713'\"\n :size=\"48\"\n :color=\"'rgba(255,255,255,0.80)'\"\n ></dof-iconfont>\n <image v-else :src=\"arrowIcon\" class=\"cell-arrow-icon\" :aria-hidden=\"true\"></image>\n </slot>\n </div>\n </div>\n </div>\n <div\n :class=\"[\n 'right-tip-wrapper',\n hasTopSubBorder && 'cell-top-border',\n hasSubBottomBorder && 'cell-bottom-border',\n special && 'space-gap'\n ]\"\n v-if=\"rightTip\"\n >\n <slot name=\"rightTip\">\n <text class=\"right-tip-text\" @click=\"dofRightTipClicked\">{{ rightTip }}</text>\n </slot>\n </div>\n </slot>\n </div>\n </div>\n <div v-if=\"useFakeBorder\" class=\"fake-border\" :style=\"fakeBorderStyleRender\"></div>\n </div>\n</template>\n\n<style scoped>\n.wrapper {\n /*hairong add for swipe*/\n overflow: hidden;\n position: relative;\n /* end by hairong*/\n /* 解决安卓渲染间隔问题 */\n /* margin-bottom: -1px; */\n /* padding-bottom: -1px; */\n}\n\n.fake-border {\n /* width: 750px; */\n height: 1px;\n position: absolute;\n bottom: 1px;\n left: 0;\n /* background-color: #f2f2f2; */\n}\n\n.cell-margin {\n margin-bottom: 16px;\n}\n\n.dof-cell-highlight:active {\n background-color: #f5f5f5;\n}\n\n.dof-cell {\n display: flex;\n flex-direction: row;\n flex: 1;\n /* align-items: center; */\n}\n.cell-wrapper {\n flex: 1;\n}\n\n.mgb-1 {\n margin-bottom: 1px;\n}\n\n.cell-disabled-opacity {\n opacity: 0.3;\n}\n\n.cell-abled-opacity {\n opacity: 1;\n}\n\n/* left部分 */\n.left {\n justify-content: center;\n /* border-width: 1px; */\n}\n\n.img-wrapper {\n}\n\n.circle-bg {\n margin-left: 32px;\n /* width: 96px;\n height: 96px; */\n display: flex;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n}\n\n.text-dot-tip {\n width: 16px;\n height: 16px;\n border-radius: 10px;\n background-color: #ff3b30;\n justify-content: center;\n align-items: center;\n text-align: center;\n margin-left: 22px;\n}\n\n.dot-tip {\n position: absolute;\n top: 34px;\n right: 0px;\n width: 16px;\n height: 16px;\n border-radius: 10px;\n background-color: #ff3b30;\n}\n\n.dot-num-tip {\n position: absolute;\n font-size: 24px;\n top: 34px;\n right: 16px;\n /* transform: translate(50%, 0); */\n border-radius: 100px;\n /* border-width: 1px;\n border-color: #ffffff; */\n background-color: #ff3b30;\n align-items: center;\n justify-content: center;\n padding-left: 8px;\n padding-right: 8px;\n line-height: 1;\n}\n\n.dot-num-tip-text {\n font-size: 24px;\n color: #ffffff;\n}\n\n.left-img {\n /* width: 64px;\n height: 64px; */\n}\n\n.main-container {\n flex: 1;\n flex-direction: row;\n align-items: center;\n /* padding: 0 0px 0 32px; */\n margin-left: 32px;\n overflow: hidden;\n\n /* border-width: 1px;\n border-color: red; */\n}\n\n.Dotleft32 {\n margin-left: 32px;\n}\n\n.Dotright32 {\n margin-right: 32px;\n}\n\n.notDot {\n margin-left: 0px;\n}\n\n.dotRight {\n right: 32px;\n}\n\n/* label */\n.cell-label-text {\n font-size: 30px;\n color: #666666;\n width: 188px;\n margin-right: 10px;\n}\n\n/* middle部分 */\n.middle {\n flex: 1;\n min-height: 104px;\n overflow: hidden;\n /* margin-right: 32px; */\n /* border-width: 1px;\n border-color: blue; */\n}\n\n.has-desc {\n min-height: 160px;\n /* padding-top: 26px; */\n /* margin-bottom: 2px; */\n justify-content: center;\n}\n\n.no-desc {\n justify-content: center;\n}\n\n.cell-title-wrapper {\n flex-direction: row;\n margin-right: 40px;\n overflow: hidden;\n}\n\n.cell-title-content {\n /* flex: 1; */\n /* max-width: 400px; */\n flex: 1;\n flex-direction: row;\n align-items: center;\n justify-content: stretch;\n /* border-width: 1px;\n border-color: orange; */\n overflow: hidden;\n}\n\n.title-flex-expand {\n flex: 1;\n}\n\n.cell-title {\n flex: 1;\n flex-direction: row;\n align-items: center;\n /* justify-content: flex-start; */\n}\n\n.avatar-icon {\n width: 40px;\n height: 40px;\n border-radius: 20px;\n margin-right: 24px;\n}\n\n.cell-title-text {\n font-family: PingFangSC-Regular;\n font-size: 32px;\n /* line-height: 32px; */\n color: #000000;\n lines: 1;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n\n/* tag */\n\n.cell-title-tag {\n width: 88px;\n height: 48px;\n justify-content: center;\n align-items: center;\n text-align: center;\n background-color: #f2f2f2;\n border-radius: 24px;\n margin-left: 18px;\n}\n\n.cell-title-tag-text {\n font-family: PingFangSC-Medium;\n font-size: 24px;\n color: #666666;\n /* line-height: 24px; */\n}\n\n/* desc */\n.cell-desc-wrapper {\n /* flex: 1; */\n margin-top: 16px;\n /* border-width: 1px;\n border-color: tomato; */\n /* padding-bottom: 30px; */\n /* min-height: 36px; */\n}\n\n.margin-top-24 {\n margin-top: 18px;\n}\n\n.cell-desc {\n /* border-width: 1px;\n border-color: aqua; */\n}\n\n.cell-desc-text {\n font-family: PingFangSC-Regular;\n color: #8a8a8f;\n font-size: 24px;\n /* line-height: 36px; */\n /* desc和title的间距 */\n /* margin-top: 4px; */\n /* margin-right: 30px; */\n /* 文字超出设置 */\n lines: 2;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n\n/* 右部 */\n.right-tip-wrapper {\n padding: 40px 32px 0 0;\n /* border-width: 1px; */\n}\n\n.space-gap {\n margin-left: 92px;\n}\n\n.right-tip-text {\n font-family: PingFangSC-Regular;\n color: #8a8a8f;\n font-size: 24px;\n /* line-height: 24px; */\n text-align: right;\n}\n\n.right {\n flex-direction: row;\n align-items: center;\n padding-right: 32px;\n padding-left: 32px;\n}\n\n.has-no-padding-left {\n padding-right: 0;\n padding-left: 0;\n}\n\n.right-text-wrapper {\n /* 文字距离图标间隔 */\n /* margin-left: 80px;\n border-width: 1px;\n border-color: greenyellow; */\n}\n\n.right-text {\n font-family: PingFangSC-Regular;\n color: #666666;\n font-size: 28px;\n /* line-height: 28px; */\n letter-spacing: 0;\n text-align: right;\n}\n\n.normal-right-text {\n font-size: 32px;\n /* line-height: 32px; */\n}\n\n.single-line-text {\n /* color: #8a8a8f;\n font-size: 24px;\n line-height: 34px; */\n}\n\n/* arrow */\n.arrow-wrapper {\n padding-left: 20px;\n}\n\n.cell-arrow-icon {\n width: 22px;\n height: 22px;\n}\n\n.midea-swipe-cell__right {\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n justify-content: center;\n align-items: center;\n background-color: #ff3b30;\n font-size: 32px;\n color: #ffffff;\n}\n</style>\n<style scoped src=\"./colmo.css\"></style>\n\n<script>\nconst icon = require('../setting/icon.base64.js')\nconst modal = weex.requireModule('modal')\nconst dom = weex.requireModule('dom')\nimport DofIconfont from '../dof-iconfont'\nimport ColmoMixin from '../../mixins/colmo'\nexport default {\n mixins: [ColmoMixin],\n components: { DofIconfont },\n props: {\n special: {\n type: Boolean,\n default: false\n },\n label: {\n type: String,\n default: ''\n },\n isHighlight: {\n type: Boolean,\n default: true\n },\n title: {\n type: String,\n default: ''\n },\n tag: {\n type: String,\n default: ''\n },\n extraContent: {\n type: String,\n default: ''\n },\n desc: {\n type: String,\n default: ''\n },\n hasTextTip: {\n type: Boolean,\n default: false\n },\n badgeNum: {\n type: [Number, String],\n default: 0\n },\n badgeMax: {\n type: Number,\n default: 0\n },\n badgeTheme: {\n type: String,\n default: 'red'\n },\n badgeColor: {\n type: String,\n default: ''\n },\n hasDot: {\n type: Boolean,\n default: false\n },\n avatarIcon: {\n type: String,\n default: ''\n },\n // 使用字体图标\n avatarIconFont: {\n type: String,\n default: ''\n },\n iconSize: {\n type: String,\n default: 'big'\n },\n iconSizeCustom: {\n // { iconSize: 96, bgSize: 96 }\n type: Object,\n default: () => ({})\n },\n cellStyle: {\n type: Object,\n default: () => ({})\n },\n rightTextStyle: {\n type: Object,\n default: () => ({})\n },\n backgroundColor: {\n type: String,\n default: ''\n },\n textColor: {\n type: String,\n default: ''\n },\n iconColor: {\n type: String,\n default: ''\n },\n hasTopBorder: {\n type: Boolean,\n default: false\n },\n hasTopSubBorder: {\n type: Boolean,\n default: false\n },\n hasBottomBorder: {\n type: Boolean,\n default: false\n },\n hasSubTopBorder: {\n type: Boolean,\n default: false\n },\n hasSubBottomBorder: {\n type: Boolean,\n default: false\n },\n hasMargin: {\n type: Boolean,\n default: false\n },\n hasVerticalIndent: {\n type: Boolean,\n default: true\n },\n hasArrow: {\n type: Boolean,\n default: true\n },\n rightText: {\n type: String,\n default: ''\n },\n rightTip: {\n type: String,\n default: ''\n },\n disabled: {\n type: Boolean,\n default: false\n },\n autoAccessible: {\n type: Boolean,\n default: true\n },\n fakeBorderStyle: {\n type: Object,\n default: () => ({})\n },\n titleTextStyle: {\n type: Object,\n default: () => ({})\n },\n descTextStyle: {\n type: Object,\n default: () => ({})\n }\n },\n data: () => ({\n arrowIcon: icon.arrowIconNew,\n offset: 0,\n dragging: false,\n badgeThemeList: {\n brand: '#267aff',\n red: '#ff3b30',\n purple: '#995efc',\n 'blue-purple': '#6575ff',\n blue: '#29c3ff',\n cyan: '#00cbb8',\n yellow: '#ffaa10',\n orange: '#ff8225',\n 'orange-red': '#ff6a4c',\n 'gray-offline': '#7c879b'\n }\n }),\n\n computed: {\n _backgroundColor() {\n if (this.backgroundColor) return this.backgroundColor\n return this._isColmo ? '#1d1f22' : '#ffffff'\n },\n _borderColor() {\n return this._isColmo ? '#343639' : '#f2f2f2'\n },\n useFakeBorder() {\n return JSON.stringify(this.fakeBorderStyle) !== '{}'\n },\n // cell样式\n cellStyleComp() {\n const { cellStyle, _backgroundColor } = this\n return {\n backgroundColor: _backgroundColor,\n ...cellStyle\n }\n },\n dotNum() {\n let { badgeNum, badgeMax } = this\n let value = ''\n let curContent = Number(badgeNum)\n if (badgeMax && curContent >= badgeMax) {\n value = `${badgeMax}+`\n } else {\n value = badgeNum\n }\n return value\n },\n //处理特殊类型cell高度问题\n innerCellHeightComp() {\n const { special, desc } = this\n if (special && desc) {\n return {\n minHeight: '200px',\n paddingTop: '32px'\n }\n }\n return ''\n },\n // 文字样式颜色\n textColorComp() {\n const { textColor } = this\n if (textColor) {\n return {\n color: textColor\n }\n } else {\n return {}\n }\n },\n titleStyleComp() {\n const { textColor, titleTextStyle } = this\n if (textColor) {\n return {\n color: textColor,\n ...titleTextStyle\n }\n } else {\n return {\n ...titleTextStyle\n }\n }\n },\n descStyleComp() {\n const { textColor, descTextStyle } = this\n if (textColor) {\n return {\n color: textColor,\n ...descTextStyle\n }\n } else {\n return {\n ...descTextStyle\n }\n }\n },\n avatarIconBgSizeComp() {\n let { iconSize, iconColor } = this\n let iconSizeCustom = this.iconSizeCustom.bgSize\n if (iconSizeCustom) {\n return {\n width: iconSizeCustom + 'px',\n height: iconSizeCustom + 'px',\n borderRadius: iconSizeCustom / 2 + 'px',\n backgroundColor: iconColor ? iconColor : 'transparent'\n }\n }\n if (iconSize === 'max') {\n return {\n width: '112px',\n height: '112px',\n borderRadius: '56px',\n marginTop: this._isColmo ? '0px' : '16px',\n marginBottom: this._isColmo ? '0px' : '16px',\n backgroundColor: iconColor ? iconColor : 'transparent'\n }\n } else if (iconSize === 'medium') {\n return {\n width: '76px',\n height: '76px',\n borderRadius: '38px',\n marginTop: this._isColmo ? '0px' : '40px',\n marginBottom: this._isColmo ? '0px' : '40px',\n backgroundColor: iconColor ? iconColor : 'transparent'\n }\n } else if (iconSize === 'min') {\n return {\n width: '40px',\n height: '40px',\n borderRadius: '20px',\n marginTop: this._isColmo ? '0px' : '32px',\n marginBottom: this._isColmo ? '0px' : '32px',\n backgroundColor: iconColor ? iconColor : 'transparent'\n }\n } else {\n return {\n width: '64px',\n height: '64px',\n borderRadius: '32px',\n marginTop: this._isColmo ? '0px' : '48px',\n marginBottom: this._isColmo ? '0px' : '48px',\n backgroundColor: iconColor ? iconColor : 'transparent'\n }\n }\n },\n avatarIconSizeComp() {\n let { iconSize } = this\n let iconSizeCustom = this.iconSizeCustom.iconSize\n if (iconSizeCustom) {\n return {\n width: iconSizeCustom + 'px',\n height: iconSizeCustom + 'px',\n borderRadius: iconSizeCustom / 2 + 'px'\n }\n }\n if (iconSize === 'max') {\n return {\n width: '96px',\n height: '96px'\n }\n } else if (iconSize === 'medium') {\n return {\n width: '64px',\n height: '64px'\n }\n } else if (iconSize === 'min') {\n return {\n width: '24px',\n height: '24px'\n }\n } else {\n return {\n width: '48px',\n height: '48px'\n }\n }\n },\n avatarIconFontSize() {\n let { iconSize } = this\n if (iconSize === 'max') {\n return 80\n } else if (iconSize === 'medium') {\n return 40\n } else if (iconSize === 'min') {\n return 24\n } else {\n return 64\n }\n },\n rightTextStyleComp() {\n const { textColor, rightTextStyle, avatarIcon, iconSize } = this\n if (textColor) {\n return {\n color: textColor,\n ...rightTextStyle\n }\n } else {\n return {\n ...rightTextStyle\n }\n }\n },\n hackMrgb1pxcom() {\n let { hasSubBottomBorder, hasBottomBorder } = this\n return hasSubBottomBorder || hasBottomBorder ? true : false\n },\n borderStyleComp() {\n let {\n cellStyle: { borderColor = null },\n hasTopBorder,\n hasBottomBorder\n } = this\n if (borderColor) {\n if (hasTopBorder) {\n return {\n borderTopWidth: '1px',\n borderTopColor: borderColor\n }\n } else if (hasBottomBorder) {\n return {\n borderBottomWidth: '1px',\n borderBottomColor: borderColor\n }\n } else {\n return {}\n }\n } else {\n if (hasTopBorder) {\n return {\n borderTopWidth: '1px',\n borderTopColor: this._borderColor\n }\n } else if (hasBottomBorder) {\n return {\n borderBottomWidth: '1px',\n borderBottomColor: this._borderColor\n }\n } else {\n return {}\n }\n }\n },\n subBorderStyleComp() {\n let {\n cellStyle: { borderColor = null },\n hasSubTopBorder,\n hasSubBottomBorder\n } = this\n if (borderColor) {\n if (hasSubTopBorder) {\n return {\n borderTopWidth: '1px',\n borderTopColor: borderColor\n }\n } else if (hasSubBottomBorder) {\n return {\n borderBottomWidth: '1px',\n borderBottomColor: borderColor\n }\n } else {\n return {}\n }\n } else {\n if (hasSubTopBorder) {\n return {\n borderTopWidth: '1px',\n borderTopColor: this._borderColor\n }\n } else if (hasSubBottomBorder) {\n return {\n borderBottomWidth: '1px',\n borderBottomColor: this._borderColor\n }\n } else {\n return {}\n }\n }\n },\n badgeStyle() {\n let { badgeTheme, badgeThemeList, badgeColor } = this\n return {\n backgroundColor: badgeColor ? badgeColor : badgeThemeList[badgeTheme]\n }\n },\n // 底部border样式\n fakeBorderStyleRender() {\n return {\n backgroundColor: this._isColmo ? '#343639' : '#F2F2F2',\n ...this.fakeBorderStyle\n }\n }\n },\n methods: {\n onClick() {\n const { disabled } = this\n !disabled && this.$emit('dofCellClicked')\n },\n dofRightTipClicked() {\n const { rightTip } = this\n rightTip && this.$emit('dofRightTipClicked')\n }\n }\n}\n</script>\n",null],"sourceRoot":""}]);
8923
8923
 
8924
8924
  // exports
8925
8925
 
@@ -9409,7 +9409,7 @@ exports = module.exports = __webpack_require__(0)(true);
9409
9409
 
9410
9410
 
9411
9411
  // module
9412
- exports.push([module.i, "\n.step-body[data-v-c2751e36] {\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -webkit-flex-direction: column;\n flex-direction: column;\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n -webkit-box-align: stretch;\n -webkit-align-items: stretch;\n align-items: stretch;\n overflow: hidden;\n}\n.step-flow-wrapper[data-v-c2751e36] {\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n height: 0.21333rem;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-pack: start;\n -webkit-justify-content: flex-start;\n justify-content: flex-start;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n overflow: hidden;\n}\n.step-line[data-v-c2751e36] {\n width: 0px;\n height: 0.02667rem;\n border-top-color: #e5e5e8;\n border-top-width: 0.02667rem;\n border-top-style: solid;\n margin-left: 0.10667rem;\n margin-right: 0.10667rem;\n}\n.hline[data-v-c2751e36] {\n border-top-width: 0.05333rem;\n}\n.step-item-wrapper[data-v-c2751e36] {\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: start;\n -webkit-align-items: flex-start;\n align-items: flex-start;\n}\n.step-item[data-v-c2751e36] {\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -webkit-flex-direction: column;\n flex-direction: column;\n -webkit-box-pack: start;\n -webkit-justify-content: flex-start;\n justify-content: flex-start;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n overflow: hidden;\n word-wrap: break-word;\n word-break: break-all;\n padding-left: 0.10667rem;\n padding-right: 0.10667rem;\n}\n.step-point[data-v-c2751e36] {\n width: 0.21333rem;\n height: 0.21333rem;\n background-color: #c7c7cc;\n border-radius: 0.42667rem;\n}\n.step-desc[data-v-c2751e36] {\n padding-top: 0.26667rem;\n font-family: PingFangSC-Regular;\n font-size: 0.34667rem;\n color: #8a8a8f;\n text-align: center;\n}\n.active-step[data-v-c2751e36] {\n color: #000000;\n}\n", "", {"version":3,"sources":["/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-step-flow-h/index.vue?572effbc"],"names":[],"mappings":";AA2JA;EACA,6BAAA;EAAA,8BAAA;EAAA,+BAAA;UAAA,uBAAA;EACA,yBAAA;EAAA,gCAAA;UAAA,wBAAA;EACA,2BAAA;EAAA,6BAAA;UAAA,qBAAA;EACA,iBAAA;CACA;AACA;EACA,mBAAA;EACA,QAAA;EACA,SAAA;EACA,OAAA;EACA,mBAAA;EACA,+BAAA;EAAA,8BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,wBAAA;EAAA,oCAAA;UAAA,4BAAA;EACA,0BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,iBAAA;CACA;AACA;EACA,WAAA;EACA,mBAAA;EACA,0BAAA;EACA,6BAAA;EACA,wBAAA;EACA,wBAAA;EACA,yBAAA;CACA;AAEA;EACA,6BAAA;CACA;AACA;EACA,+BAAA;EAAA,8BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,0BAAA;EAAA,uCAAA;UAAA,+BAAA;EACA,yBAAA;EAAA,gCAAA;UAAA,wBAAA;CACA;AACA;EACA,6BAAA;EAAA,8BAAA;EAAA,+BAAA;UAAA,uBAAA;EACA,wBAAA;EAAA,oCAAA;UAAA,4BAAA;EACA,0BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,iBAAA;EACA,sBAAA;EACA,sBAAA;EACA,yBAAA;EACA,0BAAA;CACA;AACA;EACA,kBAAA;EACA,mBAAA;EACA,0BAAA;EACA,0BAAA;CACA;AACA;EACA,wBAAA;EACA,gCAAA;EACA,sBAAA;EACA,eAAA;EACA,mBAAA;CACA;AACA;EACA,eAAA;CACA","file":"index.vue","sourcesContent":["<template>\n <div class=\"step-body\">\n <div class=\"step-item-wrapper\" :style=\"[rowStyles]\" ref=\"wrapper\">\n <div class=\"step-flow-wrapper\">\n <template v-for=\"(item, index) in formattedList\">\n <div\n v-if=\"index < formattedList.length - 1\"\n :class=\"['step-line', showLine && 'hline']\"\n :key=\"'line' + index\"\n :style=\"{ ...item.lineStyles, ...linePos[index] }\"\n ></div>\n </template>\n </div>\n <div\n v-for=\"(item, index) in formattedList\"\n :key=\"'desc' + index\"\n class=\"step-item\"\n :ref=\"'item' + index\"\n :style=\"[item.columnStyles]\"\n >\n <div :class=\"['step-point']\" :style=\"[item.pointStyles]\" :ref=\"'point' + index\"></div>\n <text :class=\"['step-desc']\" :style=\"[item.descStyles]\">{{ item.desc }}</text>\n </div>\n </div>\n </div>\n</template>\n\n<script>\nconst domModule = weex.requireModule('dom')\nexport default {\n props: {\n list: {\n type: Array,\n default: () => []\n },\n stylesConfig: {\n type: Object,\n default: function() {\n return {}\n }\n },\n showLine: {\n type: Boolean,\n default: false\n }\n },\n data() {\n return {\n componentWidth: 750,\n activeIndex: -1,\n linePos: []\n }\n },\n watch: {\n list(newVal) {\n this.$nextTick(() => {\n setTimeout(() => {\n this.init()\n }, 100)\n })\n }\n },\n computed: {\n formattedList() {\n let formattedList = this.formatList(this.list)\n return formattedList\n },\n rowStyles() {\n const { rowStyles = {} } = this.stylesConfig\n\n //处理行\n return { ...rowStyles }\n }\n },\n methods: {\n init() {\n this.list.forEach(item => {\n this.linePos.push({ width: 0 })\n })\n // 确定第一条线的左边距离\n if (this.linePos.length > 0) {\n domModule.getComponentRect(this.$refs['item0'][0], data => {\n this.linePos[0]['margin-left'] = data.size.width / 2 + 8 + 'px'\n })\n }\n this.list.forEach((item, index, arr) => {\n // 确定条线的宽度\n domModule.getComponentRect(this.$refs['point' + index][0], data => {\n if (index == 0) {\n this.linePos[index]['data-right'] = data.size.right\n } else {\n this.linePos[index]['data-right'] = data.size.right\n this.linePos[index - 1]['width'] = data.size.left - this.linePos[index - 1]['data-right'] + 'px'\n }\n })\n })\n },\n formatList(list) {\n let tempList = JSON.parse(JSON.stringify(list))\n const {\n activedColor = '#00de51',\n pointStyles = {},\n lineStyles = {},\n descStyles = {},\n columnStyles = {}\n } = this.stylesConfig\n\n tempList.forEach((item, index) => {\n if (item.isActived) this.activeIndex = index\n })\n\n let result = []\n result = tempList.map((item, index) => {\n //处理列\n item['columnStyles'] = { ...item['columnStyles'], ...columnStyles }\n\n //处理节点point\n item['pointStyles'] = { ...item['pointStyles'], ...pointStyles }\n\n if (index <= this.activeIndex) {\n item['pointStyles']['background-color'] = activedColor\n item['pointStyles']['opacity'] = 1\n }\n\n //处理节点线条\n item['lineStyles'] = { ...item['lineStyles'], ...lineStyles }\n if (index < this.activeIndex) {\n item['lineStyles']['border-top-color'] = activedColor\n item['lineStyles']['opacity'] = 1\n }\n\n //处理内容\n item['descStyles'] = { ...item['descStyles'], ...descStyles }\n if (item.isActived && activedColor) {\n item['descStyles']['color'] = activedColor\n item['descStyles']['opacity'] = 1\n }\n\n return item\n })\n\n return result\n }\n },\n mounted() {\n this.$nextTick(() => {\n setTimeout(() => {\n this.init()\n }, 100)\n })\n }\n}\n</script>\n\n<style scoped>\n.step-body {\n flex-direction: column;\n justify-content: center;\n align-items: stretch;\n overflow: hidden;\n}\n.step-flow-wrapper {\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n height: 16px;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n overflow: hidden;\n}\n.step-line {\n width: 0px;\n height: 2px;\n border-top-color: #e5e5e8;\n border-top-width: 2px;\n border-top-style: solid;\n margin-left: 8px;\n margin-right: 8px;\n}\n\n.hline {\n border-top-width: 4px;\n}\n.step-item-wrapper {\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-start;\n}\n.step-item {\n flex-direction: column;\n justify-content: flex-start;\n align-items: center;\n overflow: hidden;\n word-wrap: break-word;\n word-break: break-all;\n padding-left: 8px;\n padding-right: 8px;\n}\n.step-point {\n width: 16px;\n height: 16px;\n background-color: #c7c7cc;\n border-radius: 32px;\n}\n.step-desc {\n padding-top: 20px;\n font-family: PingFangSC-Regular;\n font-size: 26px;\n color: #8a8a8f;\n text-align: center;\n}\n.active-step {\n color: #000000;\n}\n</style>\n"],"sourceRoot":""}]);
9412
+ exports.push([module.i, "\n.step-body[data-v-c2751e36] {\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -webkit-flex-direction: column;\n flex-direction: column;\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n justify-content: center;\n -webkit-box-align: stretch;\n -webkit-align-items: stretch;\n align-items: stretch;\n overflow: hidden;\n}\n.step-flow-wrapper[data-v-c2751e36] {\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n height: 0.21333rem;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-pack: start;\n -webkit-justify-content: flex-start;\n justify-content: flex-start;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n overflow: hidden;\n}\n.step-line[data-v-c2751e36] {\n width: 0px;\n height: 0.02667rem;\n border-top-color: #e5e5e8;\n border-top-width: 0.02667rem;\n border-top-style: solid;\n margin-left: 0.10667rem;\n margin-right: 0.10667rem;\n}\n.hline[data-v-c2751e36] {\n border-top-width: 0.05333rem;\n}\n.step-item-wrapper[data-v-c2751e36] {\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: start;\n -webkit-align-items: flex-start;\n align-items: flex-start;\n}\n.step-item[data-v-c2751e36] {\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -webkit-flex-direction: column;\n flex-direction: column;\n -webkit-box-pack: start;\n -webkit-justify-content: flex-start;\n justify-content: flex-start;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n overflow: hidden;\n word-wrap: break-word;\n word-break: break-all;\n padding-left: 0.10667rem;\n padding-right: 0.10667rem;\n}\n.step-point[data-v-c2751e36] {\n width: 0.21333rem;\n height: 0.21333rem;\n background-color: #c7c7cc;\n border-radius: 0.42667rem;\n}\n.step-desc[data-v-c2751e36] {\n padding-top: 0.26667rem;\n font-family: PingFangSC-Regular;\n font-size: 0.34667rem;\n color: #8a8a8f;\n text-align: center;\n}\n.active-step[data-v-c2751e36] {\n color: #000000;\n}\n", "", {"version":3,"sources":["/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-step-flow-h/index.vue?8ff10b22"],"names":[],"mappings":";AA2JA;EACA,6BAAA;EAAA,8BAAA;EAAA,+BAAA;UAAA,uBAAA;EACA,yBAAA;EAAA,gCAAA;UAAA,wBAAA;EACA,2BAAA;EAAA,6BAAA;UAAA,qBAAA;EACA,iBAAA;CACA;AACA;EACA,mBAAA;EACA,QAAA;EACA,SAAA;EACA,OAAA;EACA,mBAAA;EACA,+BAAA;EAAA,8BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,wBAAA;EAAA,oCAAA;UAAA,4BAAA;EACA,0BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,iBAAA;CACA;AACA;EACA,WAAA;EACA,mBAAA;EACA,0BAAA;EACA,6BAAA;EACA,wBAAA;EACA,wBAAA;EACA,yBAAA;CACA;AAEA;EACA,6BAAA;CACA;AACA;EACA,+BAAA;EAAA,8BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,0BAAA;EAAA,uCAAA;UAAA,+BAAA;EACA,yBAAA;EAAA,gCAAA;UAAA,wBAAA;CACA;AACA;EACA,6BAAA;EAAA,8BAAA;EAAA,+BAAA;UAAA,uBAAA;EACA,wBAAA;EAAA,oCAAA;UAAA,4BAAA;EACA,0BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,iBAAA;EACA,sBAAA;EACA,sBAAA;EACA,yBAAA;EACA,0BAAA;CACA;AACA;EACA,kBAAA;EACA,mBAAA;EACA,0BAAA;EACA,0BAAA;CACA;AACA;EACA,wBAAA;EACA,gCAAA;EACA,sBAAA;EACA,eAAA;EACA,mBAAA;CACA;AACA;EACA,eAAA;CACA","file":"index.vue","sourcesContent":["<template>\n <div class=\"step-body\">\n <div class=\"step-item-wrapper\" :style=\"[rowStyles]\" ref=\"wrapper\">\n <div class=\"step-flow-wrapper\">\n <template v-for=\"(item, index) in formattedList\">\n <div\n v-if=\"index < formattedList.length - 1\"\n :class=\"['step-line', showLine && 'hline']\"\n :key=\"'line' + index\"\n :style=\"Object.assign(item.lineStyles, linePos[index])\"\n ></div>\n </template>\n </div>\n <div\n v-for=\"(item, index) in formattedList\"\n :key=\"'desc' + index\"\n class=\"step-item\"\n :ref=\"'item' + index\"\n :style=\"[item.columnStyles]\"\n >\n <div :class=\"['step-point']\" :style=\"[item.pointStyles]\" :ref=\"'point' + index\"></div>\n <text :class=\"['step-desc']\" :style=\"[item.descStyles]\">{{ item.desc }}</text>\n </div>\n </div>\n </div>\n</template>\n\n<script>\nconst domModule = weex.requireModule('dom')\nexport default {\n props: {\n list: {\n type: Array,\n default: () => []\n },\n stylesConfig: {\n type: Object,\n default: function() {\n return {}\n }\n },\n showLine: {\n type: Boolean,\n default: false\n }\n },\n data() {\n return {\n componentWidth: 750,\n activeIndex: -1,\n linePos: []\n }\n },\n watch: {\n list(newVal) {\n this.$nextTick(() => {\n setTimeout(() => {\n this.init()\n }, 100)\n })\n }\n },\n computed: {\n formattedList() {\n let formattedList = this.formatList(this.list)\n return formattedList\n },\n rowStyles() {\n const { rowStyles = {} } = this.stylesConfig\n\n //处理行\n return { ...rowStyles }\n }\n },\n methods: {\n init() {\n this.list.forEach(item => {\n this.linePos.push({ width: 0 })\n })\n // 确定第一条线的左边距离\n if (this.linePos.length > 0) {\n domModule.getComponentRect(this.$refs['item0'][0], data => {\n this.linePos[0]['margin-left'] = data.size.width / 2 + 8 + 'px'\n })\n }\n this.list.forEach((item, index, arr) => {\n // 确定条线的宽度\n domModule.getComponentRect(this.$refs['point' + index][0], data => {\n if (index == 0) {\n this.linePos[index]['data-right'] = data.size.right\n } else {\n this.linePos[index]['data-right'] = data.size.right\n this.linePos[index - 1]['width'] = data.size.left - this.linePos[index - 1]['data-right'] + 'px'\n }\n })\n })\n },\n formatList(list) {\n let tempList = JSON.parse(JSON.stringify(list))\n const {\n activedColor = '#00de51',\n pointStyles = {},\n lineStyles = {},\n descStyles = {},\n columnStyles = {}\n } = this.stylesConfig\n\n tempList.forEach((item, index) => {\n if (item.isActived) this.activeIndex = index\n })\n\n let result = []\n result = tempList.map((item, index) => {\n //处理列\n item['columnStyles'] = { ...item['columnStyles'], ...columnStyles }\n\n //处理节点point\n item['pointStyles'] = { ...item['pointStyles'], ...pointStyles }\n\n if (index <= this.activeIndex) {\n item['pointStyles']['background-color'] = activedColor\n item['pointStyles']['opacity'] = 1\n }\n\n //处理节点线条\n item['lineStyles'] = { ...item['lineStyles'], ...lineStyles }\n if (index < this.activeIndex) {\n item['lineStyles']['border-top-color'] = activedColor\n item['lineStyles']['opacity'] = 1\n }\n\n //处理内容\n item['descStyles'] = { ...item['descStyles'], ...descStyles }\n if (item.isActived && activedColor) {\n item['descStyles']['color'] = activedColor\n item['descStyles']['opacity'] = 1\n }\n\n return item\n })\n\n return result\n }\n },\n mounted() {\n this.$nextTick(() => {\n setTimeout(() => {\n this.init()\n }, 100)\n })\n }\n}\n</script>\n\n<style scoped>\n.step-body {\n flex-direction: column;\n justify-content: center;\n align-items: stretch;\n overflow: hidden;\n}\n.step-flow-wrapper {\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n height: 16px;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n overflow: hidden;\n}\n.step-line {\n width: 0px;\n height: 2px;\n border-top-color: #e5e5e8;\n border-top-width: 2px;\n border-top-style: solid;\n margin-left: 8px;\n margin-right: 8px;\n}\n\n.hline {\n border-top-width: 4px;\n}\n.step-item-wrapper {\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-start;\n}\n.step-item {\n flex-direction: column;\n justify-content: flex-start;\n align-items: center;\n overflow: hidden;\n word-wrap: break-word;\n word-break: break-all;\n padding-left: 8px;\n padding-right: 8px;\n}\n.step-point {\n width: 16px;\n height: 16px;\n background-color: #c7c7cc;\n border-radius: 32px;\n}\n.step-desc {\n padding-top: 20px;\n font-family: PingFangSC-Regular;\n font-size: 26px;\n color: #8a8a8f;\n text-align: center;\n}\n.active-step {\n color: #000000;\n}\n</style>\n"],"sourceRoot":""}]);
9413
9413
 
9414
9414
  // exports
9415
9415
 
@@ -12431,6 +12431,8 @@ exports.default = {
12431
12431
  width: '112px',
12432
12432
  height: '112px',
12433
12433
  borderRadius: '56px',
12434
+ marginTop: this._isColmo ? '0px' : '16px',
12435
+ marginBottom: this._isColmo ? '0px' : '16px',
12434
12436
  backgroundColor: iconColor ? iconColor : 'transparent'
12435
12437
  };
12436
12438
  } else if (iconSize === 'medium') {
@@ -12438,6 +12440,8 @@ exports.default = {
12438
12440
  width: '76px',
12439
12441
  height: '76px',
12440
12442
  borderRadius: '38px',
12443
+ marginTop: this._isColmo ? '0px' : '40px',
12444
+ marginBottom: this._isColmo ? '0px' : '40px',
12441
12445
  backgroundColor: iconColor ? iconColor : 'transparent'
12442
12446
  };
12443
12447
  } else if (iconSize === 'min') {
@@ -12445,6 +12449,8 @@ exports.default = {
12445
12449
  width: '40px',
12446
12450
  height: '40px',
12447
12451
  borderRadius: '20px',
12452
+ marginTop: this._isColmo ? '0px' : '32px',
12453
+ marginBottom: this._isColmo ? '0px' : '32px',
12448
12454
  backgroundColor: iconColor ? iconColor : 'transparent'
12449
12455
  };
12450
12456
  } else {
@@ -12452,6 +12458,8 @@ exports.default = {
12452
12458
  width: '64px',
12453
12459
  height: '64px',
12454
12460
  borderRadius: '32px',
12461
+ marginTop: this._isColmo ? '0px' : '48px',
12462
+ marginBottom: this._isColmo ? '0px' : '48px',
12455
12463
  backgroundColor: iconColor ? iconColor : 'transparent'
12456
12464
  };
12457
12465
  }
@@ -51384,8 +51392,7 @@ module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c
51384
51392
  key: 'line' + index,
51385
51393
  staticClass: " weex-ct weex-div",
51386
51394
  class: ['step-line', _vm.showLine && 'hline'],
51387
- style: (Object.assign({}, item.lineStyles,
51388
- _vm.linePos[index])),
51395
+ style: (_vm._px2rem(Object.assign(item.lineStyles, _vm.linePos[index]), 75)),
51389
51396
  attrs: {
51390
51397
  "weex-type": "div"
51391
51398
  }