dolphin-weex-ui 2.2.1 → 2.2.3

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.
Files changed (10) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/index.native.js +55 -33
  3. package/dist/index.native.js.map +1 -1
  4. package/dist/index.web.js +46 -36
  5. package/dist/index.web.js.map +1 -1
  6. package/package.json +1 -1
  7. package/packages/dof-button/index.vue +24 -1
  8. package/packages/dof-button/type.js +30 -30
  9. package/packages/dof-cell/index.vue +8 -0
  10. package/packages/dof-step-flow-h/index.vue +1 -1
package/dist/index.web.js CHANGED
@@ -8667,7 +8667,7 @@ exports = module.exports = __webpack_require__(0)(true);
8667
8667
 
8668
8668
 
8669
8669
  // module
8670
- exports.push([module.i, "\n.loading-image[data-v-5680972d] {\n height: 0.42667rem;\n width: 0.42667rem;\n margin-right: 0.13333rem;\n}\n.dof-btn[data-v-5680972d] {\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: center;\n -webkit-justify-content: center;\n justify-content: center;\n /* border-radius: 12px; */\n opacity: 1;\n position: relative;\n overflow: hidden;\n}\n.mask[data-v-5680972d] {\n position: absolute;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n}\n.mask[data-v-5680972d]:active {\n background-color: rgba(255, 255, 255, 0.1);\n}\n.dof-btn-highlight-primary-default[data-v-5680972d] {\n background-color: #267aff;\n}\n.dof-btn-highlight-primary-default[data-v-5680972d]:active {\n background-color: #226de5;\n}\n.dof-btn-highlight-primary-base[data-v-5680972d] {\n background-color: #e9f1ff;\n}\n.dof-btn-highlight-primary-base[data-v-5680972d]:active {\n background-color: #d1d8e5;\n}\n.dof-btn-highlight-primary-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-primary-plain[data-v-5680972d]:active {\n background-color: rgba(38, 122, 255, 0.1);\n}\n.dof-btn-highlight-purple-default[data-v-5680972d] {\n background-color: #995efc;\n}\n.dof-btn-highlight-purple-default[data-v-5680972d]:active {\n background-color: #8a54e3;\n}\n.dof-btn-highlight-purple-base[data-v-5680972d] {\n background-color: #eee6ff;\n}\n.dof-btn-highlight-purple-base[data-v-5680972d]:active {\n background-color: #d5cee5;\n}\n.dof-btn-highlight-purple-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-purple-plain[data-v-5680972d]:active {\n background-color: rgba(153, 94, 252, 0.1);\n}\n.dof-btn-highlight-slate-default[data-v-5680972d] {\n background-color: #6575ff;\n}\n.dof-btn-highlight-slate-default[data-v-5680972d]:active {\n background-color: #5b69e6;\n}\n.dof-btn-highlight-slate-base[data-v-5680972d] {\n background-color: #e6e8ff;\n}\n.dof-btn-highlight-slate-base[data-v-5680972d]:active {\n background-color: #ced0e5;\n}\n.dof-btn-highlight-slate-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-slate-plain[data-v-5680972d]:active {\n background-color: rgba(101, 117, 255, 0.1);\n}\n.dof-btn-highlight-aqua-default[data-v-5680972d] {\n background-color: #29c3ff;\n}\n.dof-btn-highlight-aqua-default[data-v-5680972d]:active {\n background-color: #24afe6;\n}\n.dof-btn-highlight-aqua-base[data-v-5680972d] {\n background-color: #e6f8ff;\n}\n.dof-btn-highlight-aqua-base[data-v-5680972d]:active {\n background-color: #cedee5;\n}\n.dof-btn-highlight-aqua-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-aqua-plain[data-v-5680972d]:active {\n background-color: rgba(41, 195, 255, 0.1);\n}\n.dof-btn-highlight-turquoise-default[data-v-5680972d] {\n background-color: #00cbb8;\n}\n.dof-btn-highlight-turquoise-default[data-v-5680972d]:active {\n background-color: #00b7a5;\n}\n.dof-btn-highlight-turquoise-base[data-v-5680972d] {\n background-color: #e6fffd;\n}\n.dof-btn-highlight-turquoise-base[data-v-5680972d]:active {\n background-color: #cee5e3;\n}\n.dof-btn-highlight-turquoise-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-turquoise-plain[data-v-5680972d]:active {\n background-color: rgba(0, 203, 184, 0.1);\n}\n.dof-btn-highlight-yellow-default[data-v-5680972d] {\n background-color: #ffaa10;\n}\n.dof-btn-highlight-yellow-default[data-v-5680972d]:active {\n background-color: #e5980e;\n}\n.dof-btn-highlight-yellow-base[data-v-5680972d] {\n background-color: #fff4e0;\n}\n.dof-btn-highlight-yellow-base[data-v-5680972d]:active {\n background-color: #e5dbc9;\n}\n.dof-btn-highlight-yellow-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-yellow-plain[data-v-5680972d]:active {\n background-color: rgba(255, 170, 16, 0.1);\n}\n.dof-btn-highlight-orange-default[data-v-5680972d] {\n background-color: #ff8225;\n}\n.dof-btn-highlight-orange-default[data-v-5680972d]:active {\n background-color: #e67521;\n}\n.dof-btn-highlight-orange-base[data-v-5680972d] {\n background-color: #fff0e6;\n}\n.dof-btn-highlight-orange-base[data-v-5680972d]:active {\n background-color: #e5d7ce;\n}\n.dof-btn-highlight-orange-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-orange-plain[data-v-5680972d]:active {\n background-color: rgba(255, 130, 37, 0.1);\n}\n.dof-btn-highlight-tomato-default[data-v-5680972d] {\n background-color: #ff6a4c;\n}\n.dof-btn-highlight-tomato-default[data-v-5680972d]:active {\n background-color: #e65f44;\n}\n.dof-btn-highlight-tomato-base[data-v-5680972d] {\n background-color: #ffeae6;\n}\n.dof-btn-highlight-tomato-base[data-v-5680972d]:active {\n background-color: #e6d3cf;\n}\n.dof-btn-highlight-tomato-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-tomato-plain[data-v-5680972d]:active {\n background-color: rgba(255, 106, 76, 0.1);\n}\n.dof-btn-highlight-gray-default[data-v-5680972d] {\n background-color: #7c879b;\n}\n.dof-btn-highlight-gray-default[data-v-5680972d]:active {\n background-color: #6f798b;\n}\n.dof-btn-highlight-gray-base[data-v-5680972d] {\n background-color: #cfd7e6;\n}\n.dof-btn-highlight-gray-base[data-v-5680972d]:active {\n background-color: #b9c1ce;\n}\n.dof-btn-highlight-gray-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-gray-plain[data-v-5680972d]:active {\n background-color: rgba(124, 135, 155, 0.1);\n}\n.dof-btn-highlight-colmo-default[data-v-5680972d] {\n background-color: #b35336;\n}\n.dof-btn-highlight-colmo-default[data-v-5680972d]:active {\n background-color: #743d2a;\n}\n.dof-btn-highlight-colmo-base[data-v-5680972d] {\n background-color: #292c30;\n}\n.dof-btn-highlight-colmo-base[data-v-5680972d]:active {\n background-color: rgba(0, 0, 0, 0.3);\n}\n.dof-btn-highlight-colmo-plain[data-v-5680972d] {\n background-color: transparent;\n}\n.dof-btn-highlight-colmo-plain[data-v-5680972d]:active {\n background-color: #636569;\n}\n.btn-text[data-v-5680972d] {\n font-family: PingFangSC-Medium;\n text-overflow: ellipsis;\n lines: 1;\n /* color: #ffffff; */\n /* margin-left: 10px; */\n overflow: hidden;\n text-overflow: ellipsis;\n -webkit-line-clamp: 1;\n}\n.dof-text-highlight-primary[data-v-5680972d]:active {\n color: #5b69e6;\n}\n.dof-text-highlight-purple[data-v-5680972d]:active {\n color: #8a54e3;\n}\n.dof-text-highlight-slate[data-v-5680972d]:active {\n color: #5b69e6;\n}\n.dof-text-highlight-aqua[data-v-5680972d]:active {\n color: #24afe6;\n}\n.dof-text-highlight-turquoise[data-v-5680972d]:active {\n color: #00b7a5;\n}\n.dof-text-highlight-yellow[data-v-5680972d]:active {\n color: #e5980e;\n}\n.dof-text-highlight-orange[data-v-5680972d]:active {\n color: #e67521;\n}\n.dof-text-highlight-tomatot[data-v-5680972d]:active {\n color: #e65f44;\n}\n.dof-text-highlight-gray[data-v-5680972d]:active {\n color: #6f798b;\n}\n", "", {"version":3,"sources":["/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-button/index.vue?19ec8339","/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-button/<no source>"],"names":[],"mappings":";AAwJA;EACA,mBAAA;EACA,kBAAA;EACA,yBAAA;CACA;AACA;EACA,+BAAA;EAAA,8BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,0BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,yBAAA;EAAA,gCAAA;UAAA,wBAAA;EACA,0BAAA;EACA,WAAA;EACA,mBAAA;EACA,iBAAA;CACA;AACA;EACA,mBAAA;EACA,SAAA;EACA,WAAA;EACA,YAAA;EACA,UAAA;CACA;AACA;EACA,2CAAA;CACA;AAEA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0CAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0CAAA;CACA;AAEA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,2CAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0CAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,yCAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0CAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0CAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0CAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,2CAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,qCAAA;CACA;AACA;EACA,8BAAA;CACA;AACA;EACA,0BAAA;CACA;AAEA;EACA,+BAAA;EACA,wBAAA;EACA,SAAA;EACA,qBAAA;EACA,wBAAA;EC5WA,iBAAA;EAAA,wBAAA;EAAA,sBAAA;CD6WA;AACA;EACA,eAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,eAAA;CACA","file":"index.vue","sourcesContent":["<!-- modified by liuhr7 on 19/12/28. -->\n\n<template>\n <WeexThemeView>\n <text\n v-if=\"pattern === 'plain_text'\"\n :class=\"['btn-text', isHighlight && !disabled && pattern === 'text' && !_isColmo && `dof-text-highlight-${type}`]\"\n :style=\"mrTextStyle\"\n @click=\"onTextClicked\"\n :aria-label=\"text ? text + '。按钮。' : ''\"\n >{{ loading && size == 'small' ? '' : text }}</text\n >\n <div\n v-else\n :class=\"['dof-btn', isHighlight && !disabled && !_isColmo && `dof-btn-highlight-${type}-${pattern}`]\"\n :style=\"mrBtnStyle\"\n @click=\"onClicked\"\n :accessible=\"true\"\n :aria-label=\"text ? text + '。按钮。' : ''\"\n >\n <dof-spinner :type=\"loadingGif\" class=\"loading-image\" v-if=\"loading\" />\n <slot>\n <text\n :class=\"['btn-text', isHighlight && !disabled && pattern === 'text' && `dof-text-highlight-${type}`]\"\n :style=\"mrTextStyle\"\n @click=\"onTextClicked\"\n :aria-label=\"text ? text + '。按钮。' : ''\"\n >{{ loading && size == 'small' ? '' : text }}</text\n >\n </slot>\n <div v-if=\"_isColmo && !disabled && !loading\" class=\"mask\" @click=\"onClicked\"></div>\n </div>\n </WeexThemeView>\n</template>\n\n<script>\nimport {\n STYLE_MAP,\n TEXT_STYLE_MAP,\n BUTTON_STYLE_MAP,\n COLMO_BUTTON_STYLE_MAP,\n TEXT_FONTSIZE_STYLE_MAP,\n COLMO_TEXT_FONTSIZE_STYLE_MAP\n} from './type'\nimport Utils from '../utils'\nimport ColmoMixin from '../../mixins/colmo'\nimport { WeexThemeView } from '@dolphinweex/weex-theme'\nimport DofSpinner from '../dof-spinner'\n\nexport default {\n mixins: [ColmoMixin],\n components: { WeexThemeView, DofSpinner },\n props: {\n loading: {\n type: Boolean,\n default: false\n },\n text: {\n type: String,\n default: '确认'\n },\n size: {\n type: String,\n default: 'full'\n },\n type: {\n type: String,\n default: 'primary'\n },\n pattern: {\n type: String,\n default: 'default'\n },\n disabled: {\n type: Boolean,\n default: false\n },\n isHighlight: {\n type: Boolean,\n default: true\n },\n btnStyle: Object,\n textStyle: Object,\n disabledStyle: Object\n },\n computed: {\n mrBtnStyle() {\n let { type, pattern, disabled, btnStyle, size, disabledStyle } = this\n let buttonStyle = BUTTON_STYLE_MAP\n if (this._isColmo && this.type === 'primary') {\n type = 'colmo'\n buttonStyle = COLMO_BUTTON_STYLE_MAP\n }\n const mrBtnStyle = {\n ...STYLE_MAP[type][pattern],\n ...buttonStyle[size],\n ...btnStyle\n }\n\n let disabledInStyle = { opacity: 0.3 }\n if (type === 'white') {\n disabledInStyle = { backgroundColor: 'rgba(0, 0, 0, 0.1)' }\n }\n\n return disabled\n ? {\n ...mrBtnStyle,\n ...disabledInStyle,\n ...disabledStyle\n }\n : mrBtnStyle\n },\n mrTextStyle() {\n let { type, pattern, disabled, textStyle, size } = this\n if (pattern === 'plain_text') pattern = 'text'\n let buttonTextStyle = TEXT_FONTSIZE_STYLE_MAP\n if (this._isColmo && this.type === 'primary') {\n type = 'colmo'\n buttonTextStyle = COLMO_TEXT_FONTSIZE_STYLE_MAP\n }\n const mrTextStyle = {\n ...TEXT_STYLE_MAP[type][pattern],\n ...buttonTextStyle[size],\n ...textStyle\n }\n return disabled ? { ...mrTextStyle } : mrTextStyle\n },\n loadingGif() {\n if (this._isColmo) return 'colmo'\n const { pattern } = this\n if (pattern === 'default') {\n return 'white'\n } else {\n return 'black'\n }\n }\n },\n methods: {\n onClicked(e) {\n const { type, pattern, disabled } = this\n disabled ? null : this.$emit('dofButtonClicked', { e, type, pattern, disabled })\n },\n onTextClicked(e) {\n const { type, pattern, disabled } = this\n disabled ? null : this.$emit('dofButtonClicked', { e, type, pattern, disabled })\n }\n }\n}\n</script>\n\n<style src=\"./colmo.css\"></style>\n<style scoped>\n.loading-image {\n height: 32px;\n width: 32px;\n margin-right: 10px;\n}\n.dof-btn {\n flex-direction: row;\n align-items: center;\n justify-content: center;\n /* border-radius: 12px; */\n opacity: 1;\n position: relative;\n overflow: hidden;\n}\n.mask {\n position: absolute;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n}\n.mask:active {\n background-color: rgba(255, 255, 255, 0.1);\n}\n\n.dof-btn-highlight-primary-default {\n background-color: #267aff;\n}\n.dof-btn-highlight-primary-default:active {\n background-color: #226de5;\n}\n.dof-btn-highlight-primary-base {\n background-color: #e9f1ff;\n}\n.dof-btn-highlight-primary-base:active {\n background-color: #d1d8e5;\n}\n.dof-btn-highlight-primary-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-primary-plain:active {\n background-color: rgba(38, 122, 255, 0.1);\n}\n.dof-btn-highlight-purple-default {\n background-color: #995efc;\n}\n.dof-btn-highlight-purple-default:active {\n background-color: #8a54e3;\n}\n.dof-btn-highlight-purple-base {\n background-color: #eee6ff;\n}\n.dof-btn-highlight-purple-base:active {\n background-color: #d5cee5;\n}\n.dof-btn-highlight-purple-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-purple-plain:active {\n background-color: rgba(153, 94, 252, 0.1);\n}\n\n.dof-btn-highlight-slate-default {\n background-color: #6575ff;\n}\n.dof-btn-highlight-slate-default:active {\n background-color: #5b69e6;\n}\n.dof-btn-highlight-slate-base {\n background-color: #e6e8ff;\n}\n.dof-btn-highlight-slate-base:active {\n background-color: #ced0e5;\n}\n.dof-btn-highlight-slate-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-slate-plain:active {\n background-color: rgba(101, 117, 255, 0.1);\n}\n.dof-btn-highlight-aqua-default {\n background-color: #29c3ff;\n}\n.dof-btn-highlight-aqua-default:active {\n background-color: #24afe6;\n}\n.dof-btn-highlight-aqua-base {\n background-color: #e6f8ff;\n}\n.dof-btn-highlight-aqua-base:active {\n background-color: #cedee5;\n}\n.dof-btn-highlight-aqua-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-aqua-plain:active {\n background-color: rgba(41, 195, 255, 0.1);\n}\n.dof-btn-highlight-turquoise-default {\n background-color: #00cbb8;\n}\n.dof-btn-highlight-turquoise-default:active {\n background-color: #00b7a5;\n}\n.dof-btn-highlight-turquoise-base {\n background-color: #e6fffd;\n}\n.dof-btn-highlight-turquoise-base:active {\n background-color: #cee5e3;\n}\n.dof-btn-highlight-turquoise-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-turquoise-plain:active {\n background-color: rgba(0, 203, 184, 0.1);\n}\n.dof-btn-highlight-yellow-default {\n background-color: #ffaa10;\n}\n.dof-btn-highlight-yellow-default:active {\n background-color: #e5980e;\n}\n.dof-btn-highlight-yellow-base {\n background-color: #fff4e0;\n}\n.dof-btn-highlight-yellow-base:active {\n background-color: #e5dbc9;\n}\n.dof-btn-highlight-yellow-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-yellow-plain:active {\n background-color: rgba(255, 170, 16, 0.1);\n}\n.dof-btn-highlight-orange-default {\n background-color: #ff8225;\n}\n.dof-btn-highlight-orange-default:active {\n background-color: #e67521;\n}\n.dof-btn-highlight-orange-base {\n background-color: #fff0e6;\n}\n.dof-btn-highlight-orange-base:active {\n background-color: #e5d7ce;\n}\n.dof-btn-highlight-orange-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-orange-plain:active {\n background-color: rgba(255, 130, 37, 0.1);\n}\n.dof-btn-highlight-tomato-default {\n background-color: #ff6a4c;\n}\n.dof-btn-highlight-tomato-default:active {\n background-color: #e65f44;\n}\n.dof-btn-highlight-tomato-base {\n background-color: #ffeae6;\n}\n.dof-btn-highlight-tomato-base:active {\n background-color: #e6d3cf;\n}\n.dof-btn-highlight-tomato-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-tomato-plain:active {\n background-color: rgba(255, 106, 76, 0.1);\n}\n.dof-btn-highlight-gray-default {\n background-color: #7c879b;\n}\n.dof-btn-highlight-gray-default:active {\n background-color: #6f798b;\n}\n.dof-btn-highlight-gray-base {\n background-color: #cfd7e6;\n}\n.dof-btn-highlight-gray-base:active {\n background-color: #b9c1ce;\n}\n.dof-btn-highlight-gray-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-gray-plain:active {\n background-color: rgba(124, 135, 155, 0.1);\n}\n.dof-btn-highlight-colmo-default {\n background-color: #b35336;\n}\n.dof-btn-highlight-colmo-default:active {\n background-color: #743d2a;\n}\n.dof-btn-highlight-colmo-base {\n background-color: #292c30;\n}\n.dof-btn-highlight-colmo-base:active {\n background-color: rgba(0, 0, 0, 0.3);\n}\n.dof-btn-highlight-colmo-plain {\n background-color: transparent;\n}\n.dof-btn-highlight-colmo-plain:active {\n background-color: #636569;\n}\n\n.btn-text {\n font-family: PingFangSC-Medium;\n text-overflow: ellipsis;\n lines: 1;\n /* color: #ffffff; */\n /* margin-left: 10px; */\n}\n.dof-text-highlight-primary:active {\n color: #5b69e6;\n}\n.dof-text-highlight-purple:active {\n color: #8a54e3;\n}\n.dof-text-highlight-slate:active {\n color: #5b69e6;\n}\n.dof-text-highlight-aqua:active {\n color: #24afe6;\n}\n.dof-text-highlight-turquoise:active {\n color: #00b7a5;\n}\n.dof-text-highlight-yellow:active {\n color: #e5980e;\n}\n.dof-text-highlight-orange:active {\n color: #e67521;\n}\n.dof-text-highlight-tomatot:active {\n color: #e65f44;\n}\n.dof-text-highlight-gray:active {\n color: #6f798b;\n}\n</style>\n",null],"sourceRoot":""}]);
8670
+ exports.push([module.i, "\n.loading-image[data-v-5680972d] {\n height: 0.42667rem;\n width: 0.42667rem;\n margin-right: 0.13333rem;\n}\n.dof-btn[data-v-5680972d] {\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: center;\n -webkit-justify-content: center;\n justify-content: center;\n /* border-radius: 12px; */\n opacity: 1;\n position: relative;\n overflow: hidden;\n}\n.mask[data-v-5680972d] {\n position: absolute;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n}\n.mask[data-v-5680972d]:active {\n background-color: rgba(255, 255, 255, 0.1);\n}\n.dof-btn-highlight-primary-default[data-v-5680972d] {\n background-color: #267aff;\n}\n.dof-btn-highlight-primary-default[data-v-5680972d]:active {\n background-color: #226de5;\n}\n.dof-btn-highlight-primary-base[data-v-5680972d] {\n background-color: #e9f1ff;\n}\n.dof-btn-highlight-primary-base[data-v-5680972d]:active {\n background-color: #d1d8e5;\n}\n.dof-btn-highlight-primary-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-primary-plain[data-v-5680972d]:active {\n background-color: rgba(38, 122, 255, 0.1);\n}\n.dof-btn-highlight-purple-default[data-v-5680972d] {\n background-color: #995efc;\n}\n.dof-btn-highlight-purple-default[data-v-5680972d]:active {\n background-color: #8a54e3;\n}\n.dof-btn-highlight-purple-base[data-v-5680972d] {\n background-color: #eee6ff;\n}\n.dof-btn-highlight-purple-base[data-v-5680972d]:active {\n background-color: #d5cee5;\n}\n.dof-btn-highlight-purple-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-purple-plain[data-v-5680972d]:active {\n background-color: rgba(153, 94, 252, 0.1);\n}\n.dof-btn-highlight-slate-default[data-v-5680972d] {\n background-color: #6575ff;\n}\n.dof-btn-highlight-slate-default[data-v-5680972d]:active {\n background-color: #5b69e6;\n}\n.dof-btn-highlight-slate-base[data-v-5680972d] {\n background-color: #e6e8ff;\n}\n.dof-btn-highlight-slate-base[data-v-5680972d]:active {\n background-color: #ced0e5;\n}\n.dof-btn-highlight-slate-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-slate-plain[data-v-5680972d]:active {\n background-color: rgba(101, 117, 255, 0.1);\n}\n.dof-btn-highlight-aqua-default[data-v-5680972d] {\n background-color: #29c3ff;\n}\n.dof-btn-highlight-aqua-default[data-v-5680972d]:active {\n background-color: #24afe6;\n}\n.dof-btn-highlight-aqua-base[data-v-5680972d] {\n background-color: #e6f8ff;\n}\n.dof-btn-highlight-aqua-base[data-v-5680972d]:active {\n background-color: #cedee5;\n}\n.dof-btn-highlight-aqua-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-aqua-plain[data-v-5680972d]:active {\n background-color: rgba(41, 195, 255, 0.1);\n}\n.dof-btn-highlight-turquoise-default[data-v-5680972d] {\n background-color: #00cbb8;\n}\n.dof-btn-highlight-turquoise-default[data-v-5680972d]:active {\n background-color: #00b7a5;\n}\n.dof-btn-highlight-turquoise-base[data-v-5680972d] {\n background-color: #e6fffd;\n}\n.dof-btn-highlight-turquoise-base[data-v-5680972d]:active {\n background-color: #cee5e3;\n}\n.dof-btn-highlight-turquoise-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-turquoise-plain[data-v-5680972d]:active {\n background-color: rgba(0, 203, 184, 0.1);\n}\n.dof-btn-highlight-yellow-default[data-v-5680972d] {\n background-color: #ffaa10;\n}\n.dof-btn-highlight-yellow-default[data-v-5680972d]:active {\n background-color: #e5980e;\n}\n.dof-btn-highlight-yellow-base[data-v-5680972d] {\n background-color: #fff4e0;\n}\n.dof-btn-highlight-yellow-base[data-v-5680972d]:active {\n background-color: #e5dbc9;\n}\n.dof-btn-highlight-yellow-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-yellow-plain[data-v-5680972d]:active {\n background-color: rgba(255, 170, 16, 0.1);\n}\n.dof-btn-highlight-orange-default[data-v-5680972d] {\n background-color: #ff8225;\n}\n.dof-btn-highlight-orange-default[data-v-5680972d]:active {\n background-color: #e67521;\n}\n.dof-btn-highlight-orange-base[data-v-5680972d] {\n background-color: #fff0e6;\n}\n.dof-btn-highlight-orange-base[data-v-5680972d]:active {\n background-color: #e5d7ce;\n}\n.dof-btn-highlight-orange-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-orange-plain[data-v-5680972d]:active {\n background-color: rgba(255, 130, 37, 0.1);\n}\n.dof-btn-highlight-tomato-default[data-v-5680972d] {\n background-color: #ff6a4c;\n}\n.dof-btn-highlight-tomato-default[data-v-5680972d]:active {\n background-color: #e65f44;\n}\n.dof-btn-highlight-tomato-base[data-v-5680972d] {\n background-color: #ffeae6;\n}\n.dof-btn-highlight-tomato-base[data-v-5680972d]:active {\n background-color: #e6d3cf;\n}\n.dof-btn-highlight-tomato-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-tomato-plain[data-v-5680972d]:active {\n background-color: rgba(255, 106, 76, 0.1);\n}\n.dof-btn-highlight-gray-default[data-v-5680972d] {\n background-color: #7c879b;\n}\n.dof-btn-highlight-gray-default[data-v-5680972d]:active {\n background-color: #6f798b;\n}\n.dof-btn-highlight-gray-base[data-v-5680972d] {\n background-color: #cfd7e6;\n}\n.dof-btn-highlight-gray-base[data-v-5680972d]:active {\n background-color: #b9c1ce;\n}\n.dof-btn-highlight-gray-plain[data-v-5680972d] {\n background-color: #ffffff;\n}\n.dof-btn-highlight-gray-plain[data-v-5680972d]:active {\n background-color: rgba(124, 135, 155, 0.1);\n}\n.dof-btn-highlight-red-default[data-v-5680972d] {\n background-color: #e61e1e;\n}\n.dof-btn-highlight-red-base[data-v-5680972d] {\n background-color: #fffeb7;\n}\n.dof-btn-highlight-red-plain[data-v-5680972d] {\n background-color: #fff;\n}\n.dof-btn-highlight-brown-default[data-v-5680972d] {\n background-color: #86696b;\n}\n.dof-btn-highlight-red-base[data-v-5680972d] {\n background-color: #ffd9cf;\n}\n.dof-btn-highlight-red-plain[data-v-5680972d] {\n background-color: #fff;\n}\n.dof-btn-highlight-colmo-default[data-v-5680972d] {\n background-color: #b35336;\n}\n.dof-btn-highlight-colmo-default[data-v-5680972d]:active {\n background-color: #743d2a;\n}\n.dof-btn-highlight-colmo-base[data-v-5680972d] {\n background-color: #292c30;\n}\n.dof-btn-highlight-colmo-base[data-v-5680972d]:active {\n background-color: rgba(0, 0, 0, 0.3);\n}\n.dof-btn-highlight-colmo-plain[data-v-5680972d] {\n background-color: transparent;\n}\n.dof-btn-highlight-colmo-plain[data-v-5680972d]:active {\n background-color: #636569;\n}\n.btn-text[data-v-5680972d] {\n font-family: PingFangSC-Medium;\n text-overflow: ellipsis;\n lines: 1;\n /* color: #ffffff; */\n /* margin-left: 10px; */\n overflow: hidden;\n text-overflow: ellipsis;\n -webkit-line-clamp: 1;\n}\n.dof-text-highlight-primary[data-v-5680972d]:active {\n color: #5b69e6;\n}\n.dof-text-highlight-purple[data-v-5680972d]:active {\n color: #8a54e3;\n}\n.dof-text-highlight-slate[data-v-5680972d]:active {\n color: #5b69e6;\n}\n.dof-text-highlight-aqua[data-v-5680972d]:active {\n color: #24afe6;\n}\n.dof-text-highlight-turquoise[data-v-5680972d]:active {\n color: #00b7a5;\n}\n.dof-text-highlight-yellow[data-v-5680972d]:active {\n color: #e5980e;\n}\n.dof-text-highlight-orange[data-v-5680972d]:active {\n color: #e67521;\n}\n.dof-text-highlight-tomatot[data-v-5680972d]:active {\n color: #e65f44;\n}\n.dof-text-highlight-gray[data-v-5680972d]:active {\n color: #6f798b;\n}\n", "", {"version":3,"sources":["/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-button/index.vue?33e90204","/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-button/<no source>"],"names":[],"mappings":";AA2JA;EACA,mBAAA;EACA,kBAAA;EACA,yBAAA;CACA;AACA;EACA,+BAAA;EAAA,8BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,0BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,yBAAA;EAAA,gCAAA;UAAA,wBAAA;EACA,0BAAA;EACA,WAAA;EACA,mBAAA;EACA,iBAAA;CACA;AACA;EACA,mBAAA;EACA,SAAA;EACA,WAAA;EACA,YAAA;EACA,UAAA;CACA;AACA;EACA,2CAAA;CACA;AAEA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0CAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0CAAA;CACA;AAEA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,2CAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0CAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,yCAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0CAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0CAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0CAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,2CAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,uBAAA;CACA;AAEA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,uBAAA;CACA;AAEA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,qCAAA;CACA;AACA;EACA,8BAAA;CACA;AACA;EACA,0BAAA;CACA;AAEA;EACA,+BAAA;EACA,wBAAA;EACA,SAAA;EACA,qBAAA;EACA,wBAAA;ECnYA,iBAAA;EAAA,wBAAA;EAAA,sBAAA;CDoYA;AACA;EACA,eAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,eAAA;CACA","file":"index.vue","sourcesContent":["<!-- modified by liuhr7 on 19/12/28. -->\n\n<template>\n <WeexThemeView>\n <text\n v-if=\"pattern === 'plain_text'\"\n :class=\"['btn-text', isHighlight && !disabled && pattern === 'text' && !_isColmo && `dof-text-highlight-${type}`]\"\n :style=\"mrTextStyle\"\n @click=\"onTextClicked\"\n :aria-label=\"text ? text + '。按钮。' : ''\"\n >{{ loading && size == 'small' ? '' : text }}</text\n >\n <div\n v-else\n :class=\"['dof-btn', isHighlight && !disabled && !_isColmo && `dof-btn-highlight-${type}-${pattern}`]\"\n :style=\"mrBtnStyle\"\n @click=\"onClicked\"\n :accessible=\"true\"\n :aria-label=\"text ? text + '。按钮。' : ''\"\n >\n <dof-spinner :type=\"loadingGif\" class=\"loading-image\" v-if=\"loading\" />\n <slot>\n <text\n :class=\"['btn-text', isHighlight && !disabled && pattern === 'text' && `dof-text-highlight-${type}`]\"\n :style=\"mrTextStyle\"\n @click=\"onTextClicked\"\n :aria-label=\"text ? text + '。按钮。' : ''\"\n >{{ loading && size == 'small' ? '' : text }}</text\n >\n </slot>\n <div v-if=\"_isColmo && !disabled && !loading\" class=\"mask\" @click=\"onClicked\"></div>\n </div>\n </WeexThemeView>\n</template>\n\n<script>\nimport {\n STYLE_MAP,\n TEXT_STYLE_MAP,\n BUTTON_STYLE_MAP,\n COLMO_BUTTON_STYLE_MAP,\n TEXT_FONTSIZE_STYLE_MAP,\n COLMO_TEXT_FONTSIZE_STYLE_MAP\n} from './type'\nimport Utils from '../utils'\nimport ColmoMixin from '../../mixins/colmo'\nimport { WeexThemeView } from '@dolphinweex/weex-theme'\nimport DofSpinner from '../dof-spinner'\n\nexport default {\n mixins: [ColmoMixin],\n components: { WeexThemeView, DofSpinner },\n props: {\n loading: {\n type: Boolean,\n default: false\n },\n text: {\n type: String,\n default: '确认'\n },\n size: {\n type: String,\n default: 'full'\n },\n type: {\n type: String,\n default: 'primary'\n },\n pattern: {\n type: String,\n default: 'default'\n },\n disabled: {\n type: Boolean,\n default: false\n },\n isHighlight: {\n type: Boolean,\n default: true\n },\n btnStyle: Object,\n textStyle: Object,\n disabledStyle: Object\n },\n computed: {\n mrBtnStyle() {\n let { type, pattern, disabled, btnStyle, size, disabledStyle } = this\n let buttonStyle = BUTTON_STYLE_MAP\n if (this._isColmo && this.type === 'primary') {\n type = 'colmo'\n buttonStyle = COLMO_BUTTON_STYLE_MAP\n }\n\n let styleMap = { ...STYLE_MAP[type][pattern] }\n if (!this._isColmo && pattern !== 'text' && !disabled) delete styleMap.backgroundColor\n const mrBtnStyle = {\n ...styleMap,\n ...buttonStyle[size],\n ...btnStyle\n }\n\n let disabledInStyle = { opacity: 0.3 }\n if (type === 'white') {\n disabledInStyle = { backgroundColor: 'rgba(0, 0, 0, 0.1)' }\n }\n\n return disabled\n ? {\n ...mrBtnStyle,\n ...disabledInStyle,\n ...disabledStyle\n }\n : mrBtnStyle\n },\n mrTextStyle() {\n let { type, pattern, disabled, textStyle, size } = this\n if (pattern === 'plain_text') pattern = 'text'\n let buttonTextStyle = TEXT_FONTSIZE_STYLE_MAP\n if (this._isColmo && this.type === 'primary') {\n type = 'colmo'\n buttonTextStyle = COLMO_TEXT_FONTSIZE_STYLE_MAP\n }\n const mrTextStyle = {\n ...TEXT_STYLE_MAP[type][pattern],\n ...buttonTextStyle[size],\n ...textStyle\n }\n return disabled ? { ...mrTextStyle } : mrTextStyle\n },\n loadingGif() {\n if (this._isColmo) return 'colmo'\n const { pattern } = this\n if (pattern === 'default') {\n return 'white'\n } else {\n return 'black'\n }\n }\n },\n methods: {\n onClicked(e) {\n const { type, pattern, disabled } = this\n disabled ? null : this.$emit('dofButtonClicked', { e, type, pattern, disabled })\n },\n onTextClicked(e) {\n const { type, pattern, disabled } = this\n disabled ? null : this.$emit('dofButtonClicked', { e, type, pattern, disabled })\n }\n }\n}\n</script>\n\n<style src=\"./colmo.css\"></style>\n<style scoped>\n.loading-image {\n height: 32px;\n width: 32px;\n margin-right: 10px;\n}\n.dof-btn {\n flex-direction: row;\n align-items: center;\n justify-content: center;\n /* border-radius: 12px; */\n opacity: 1;\n position: relative;\n overflow: hidden;\n}\n.mask {\n position: absolute;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n}\n.mask:active {\n background-color: rgba(255, 255, 255, 0.1);\n}\n\n.dof-btn-highlight-primary-default {\n background-color: #267aff;\n}\n.dof-btn-highlight-primary-default:active {\n background-color: #226de5;\n}\n.dof-btn-highlight-primary-base {\n background-color: #e9f1ff;\n}\n.dof-btn-highlight-primary-base:active {\n background-color: #d1d8e5;\n}\n.dof-btn-highlight-primary-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-primary-plain:active {\n background-color: rgba(38, 122, 255, 0.1);\n}\n.dof-btn-highlight-purple-default {\n background-color: #995efc;\n}\n.dof-btn-highlight-purple-default:active {\n background-color: #8a54e3;\n}\n.dof-btn-highlight-purple-base {\n background-color: #eee6ff;\n}\n.dof-btn-highlight-purple-base:active {\n background-color: #d5cee5;\n}\n.dof-btn-highlight-purple-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-purple-plain:active {\n background-color: rgba(153, 94, 252, 0.1);\n}\n\n.dof-btn-highlight-slate-default {\n background-color: #6575ff;\n}\n.dof-btn-highlight-slate-default:active {\n background-color: #5b69e6;\n}\n.dof-btn-highlight-slate-base {\n background-color: #e6e8ff;\n}\n.dof-btn-highlight-slate-base:active {\n background-color: #ced0e5;\n}\n.dof-btn-highlight-slate-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-slate-plain:active {\n background-color: rgba(101, 117, 255, 0.1);\n}\n.dof-btn-highlight-aqua-default {\n background-color: #29c3ff;\n}\n.dof-btn-highlight-aqua-default:active {\n background-color: #24afe6;\n}\n.dof-btn-highlight-aqua-base {\n background-color: #e6f8ff;\n}\n.dof-btn-highlight-aqua-base:active {\n background-color: #cedee5;\n}\n.dof-btn-highlight-aqua-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-aqua-plain:active {\n background-color: rgba(41, 195, 255, 0.1);\n}\n.dof-btn-highlight-turquoise-default {\n background-color: #00cbb8;\n}\n.dof-btn-highlight-turquoise-default:active {\n background-color: #00b7a5;\n}\n.dof-btn-highlight-turquoise-base {\n background-color: #e6fffd;\n}\n.dof-btn-highlight-turquoise-base:active {\n background-color: #cee5e3;\n}\n.dof-btn-highlight-turquoise-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-turquoise-plain:active {\n background-color: rgba(0, 203, 184, 0.1);\n}\n.dof-btn-highlight-yellow-default {\n background-color: #ffaa10;\n}\n.dof-btn-highlight-yellow-default:active {\n background-color: #e5980e;\n}\n.dof-btn-highlight-yellow-base {\n background-color: #fff4e0;\n}\n.dof-btn-highlight-yellow-base:active {\n background-color: #e5dbc9;\n}\n.dof-btn-highlight-yellow-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-yellow-plain:active {\n background-color: rgba(255, 170, 16, 0.1);\n}\n.dof-btn-highlight-orange-default {\n background-color: #ff8225;\n}\n.dof-btn-highlight-orange-default:active {\n background-color: #e67521;\n}\n.dof-btn-highlight-orange-base {\n background-color: #fff0e6;\n}\n.dof-btn-highlight-orange-base:active {\n background-color: #e5d7ce;\n}\n.dof-btn-highlight-orange-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-orange-plain:active {\n background-color: rgba(255, 130, 37, 0.1);\n}\n.dof-btn-highlight-tomato-default {\n background-color: #ff6a4c;\n}\n.dof-btn-highlight-tomato-default:active {\n background-color: #e65f44;\n}\n.dof-btn-highlight-tomato-base {\n background-color: #ffeae6;\n}\n.dof-btn-highlight-tomato-base:active {\n background-color: #e6d3cf;\n}\n.dof-btn-highlight-tomato-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-tomato-plain:active {\n background-color: rgba(255, 106, 76, 0.1);\n}\n.dof-btn-highlight-gray-default {\n background-color: #7c879b;\n}\n.dof-btn-highlight-gray-default:active {\n background-color: #6f798b;\n}\n.dof-btn-highlight-gray-base {\n background-color: #cfd7e6;\n}\n.dof-btn-highlight-gray-base:active {\n background-color: #b9c1ce;\n}\n.dof-btn-highlight-gray-plain {\n background-color: #ffffff;\n}\n.dof-btn-highlight-gray-plain:active {\n background-color: rgba(124, 135, 155, 0.1);\n}\n.dof-btn-highlight-red-default {\n background-color: #e61e1e;\n}\n.dof-btn-highlight-red-base {\n background-color: #fffeb7;\n}\n.dof-btn-highlight-red-plain {\n background-color: #fff;\n}\n\n.dof-btn-highlight-brown-default {\n background-color: #86696b;\n}\n.dof-btn-highlight-red-base {\n background-color: #ffd9cf;\n}\n.dof-btn-highlight-red-plain {\n background-color: #fff;\n}\n\n.dof-btn-highlight-colmo-default {\n background-color: #b35336;\n}\n.dof-btn-highlight-colmo-default:active {\n background-color: #743d2a;\n}\n.dof-btn-highlight-colmo-base {\n background-color: #292c30;\n}\n.dof-btn-highlight-colmo-base:active {\n background-color: rgba(0, 0, 0, 0.3);\n}\n.dof-btn-highlight-colmo-plain {\n background-color: transparent;\n}\n.dof-btn-highlight-colmo-plain:active {\n background-color: #636569;\n}\n\n.btn-text {\n font-family: PingFangSC-Medium;\n text-overflow: ellipsis;\n lines: 1;\n /* color: #ffffff; */\n /* margin-left: 10px; */\n}\n.dof-text-highlight-primary:active {\n color: #5b69e6;\n}\n.dof-text-highlight-purple:active {\n color: #8a54e3;\n}\n.dof-text-highlight-slate:active {\n color: #5b69e6;\n}\n.dof-text-highlight-aqua:active {\n color: #24afe6;\n}\n.dof-text-highlight-turquoise:active {\n color: #00b7a5;\n}\n.dof-text-highlight-yellow:active {\n color: #e5980e;\n}\n.dof-text-highlight-orange:active {\n color: #e67521;\n}\n.dof-text-highlight-tomatot:active {\n color: #e65f44;\n}\n.dof-text-highlight-gray:active {\n color: #6f798b;\n}\n</style>\n",null],"sourceRoot":""}]);
8671
8671
 
8672
8672
  // exports
8673
8673
 
@@ -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
 
@@ -11178,7 +11178,10 @@ exports.default = {
11178
11178
  type = 'colmo';
11179
11179
  buttonStyle = _type.COLMO_BUTTON_STYLE_MAP;
11180
11180
  }
11181
- var mrBtnStyle = _extends({}, _type.STYLE_MAP[type][pattern], buttonStyle[size], btnStyle);
11181
+
11182
+ var styleMap = _extends({}, _type.STYLE_MAP[type][pattern]);
11183
+ if (!this._isColmo && pattern !== 'text' && !disabled) delete styleMap.backgroundColor;
11184
+ var mrBtnStyle = _extends({}, styleMap, buttonStyle[size], btnStyle);
11182
11185
 
11183
11186
  var disabledInStyle = { opacity: 0.3 };
11184
11187
  if (type === 'white') {
@@ -12431,6 +12434,8 @@ exports.default = {
12431
12434
  width: '112px',
12432
12435
  height: '112px',
12433
12436
  borderRadius: '56px',
12437
+ marginTop: this._isColmo ? '0px' : '16px',
12438
+ marginBottom: this._isColmo ? '0px' : '16px',
12434
12439
  backgroundColor: iconColor ? iconColor : 'transparent'
12435
12440
  };
12436
12441
  } else if (iconSize === 'medium') {
@@ -12438,6 +12443,8 @@ exports.default = {
12438
12443
  width: '76px',
12439
12444
  height: '76px',
12440
12445
  borderRadius: '38px',
12446
+ marginTop: this._isColmo ? '0px' : '40px',
12447
+ marginBottom: this._isColmo ? '0px' : '40px',
12441
12448
  backgroundColor: iconColor ? iconColor : 'transparent'
12442
12449
  };
12443
12450
  } else if (iconSize === 'min') {
@@ -12445,6 +12452,8 @@ exports.default = {
12445
12452
  width: '40px',
12446
12453
  height: '40px',
12447
12454
  borderRadius: '20px',
12455
+ marginTop: this._isColmo ? '0px' : '32px',
12456
+ marginBottom: this._isColmo ? '0px' : '32px',
12448
12457
  backgroundColor: iconColor ? iconColor : 'transparent'
12449
12458
  };
12450
12459
  } else {
@@ -12452,6 +12461,8 @@ exports.default = {
12452
12461
  width: '64px',
12453
12462
  height: '64px',
12454
12463
  borderRadius: '32px',
12464
+ marginTop: this._isColmo ? '0px' : '48px',
12465
+ marginBottom: this._isColmo ? '0px' : '48px',
12455
12466
  backgroundColor: iconColor ? iconColor : 'transparent'
12456
12467
  };
12457
12468
  }
@@ -33866,13 +33877,13 @@ Object.defineProperty(exports, "__esModule", {
33866
33877
  var STYLE_MAP = exports.STYLE_MAP = {
33867
33878
  primary: {
33868
33879
  default: {
33869
- // backgroundColor: '#267AFF'
33880
+ backgroundColor: '#267AFF'
33870
33881
  },
33871
33882
  base: {
33872
- // backgroundColor: '#E9F1FF'
33883
+ backgroundColor: '#E9F1FF'
33873
33884
  },
33874
33885
  plain: {
33875
- // backgroundColor: '#FFFFFF',
33886
+ backgroundColor: '#FFFFFF',
33876
33887
  borderWidth: '2px',
33877
33888
  borderColor: '#267AFF'
33878
33889
  },
@@ -33883,13 +33894,13 @@ var STYLE_MAP = exports.STYLE_MAP = {
33883
33894
  },
33884
33895
  purple: {
33885
33896
  default: {
33886
- // backgroundColor: '#995EFC'
33897
+ backgroundColor: '#995EFC'
33887
33898
  },
33888
33899
  base: {
33889
- // backgroundColor: '#EEE6FF'
33900
+ backgroundColor: '#EEE6FF'
33890
33901
  },
33891
33902
  plain: {
33892
- // backgroundColor: '#FFFFFF',
33903
+ backgroundColor: '#FFFFFF',
33893
33904
  borderWidth: '2px',
33894
33905
  borderColor: '#995EFC'
33895
33906
  },
@@ -33900,13 +33911,13 @@ var STYLE_MAP = exports.STYLE_MAP = {
33900
33911
  },
33901
33912
  slate: {
33902
33913
  default: {
33903
- // backgroundColor: '#6575FF'
33914
+ backgroundColor: '#6575FF'
33904
33915
  },
33905
33916
  base: {
33906
- // backgroundColor: '#E6E8FF'
33917
+ backgroundColor: '#E6E8FF'
33907
33918
  },
33908
33919
  plain: {
33909
- // backgroundColor: '#FFFFFF',
33920
+ backgroundColor: '#FFFFFF',
33910
33921
  borderWidth: '2px',
33911
33922
  borderColor: '#6575FF'
33912
33923
  },
@@ -33917,13 +33928,13 @@ var STYLE_MAP = exports.STYLE_MAP = {
33917
33928
  },
33918
33929
  aqua: {
33919
33930
  default: {
33920
- // backgroundColor: '#29C3FF'
33931
+ backgroundColor: '#29C3FF'
33921
33932
  },
33922
33933
  base: {
33923
- // backgroundColor: '#E6F8FF'
33934
+ backgroundColor: '#E6F8FF'
33924
33935
  },
33925
33936
  plain: {
33926
- // backgroundColor: '#FFFFFF',
33937
+ backgroundColor: '#FFFFFF',
33927
33938
  borderWidth: '2px',
33928
33939
  borderColor: '#29C3FF'
33929
33940
  },
@@ -33934,13 +33945,13 @@ var STYLE_MAP = exports.STYLE_MAP = {
33934
33945
  },
33935
33946
  turquoise: {
33936
33947
  default: {
33937
- // backgroundColor: '#00CBB8'
33948
+ backgroundColor: '#00CBB8'
33938
33949
  },
33939
33950
  base: {
33940
- // backgroundColor: '#E6FFFD'
33951
+ backgroundColor: '#E6FFFD'
33941
33952
  },
33942
33953
  plain: {
33943
- // backgroundColor: '#FFFFFF',
33954
+ backgroundColor: '#FFFFFF',
33944
33955
  borderWidth: '2px',
33945
33956
  borderColor: '#00CBB8'
33946
33957
  },
@@ -33951,13 +33962,13 @@ var STYLE_MAP = exports.STYLE_MAP = {
33951
33962
  },
33952
33963
  yellow: {
33953
33964
  default: {
33954
- // backgroundColor: '#FFAA10'
33965
+ backgroundColor: '#FFAA10'
33955
33966
  },
33956
33967
  base: {
33957
- // backgroundColor: '#FFF4E0'
33968
+ backgroundColor: '#FFF4E0'
33958
33969
  },
33959
33970
  plain: {
33960
- // backgroundColor: '#FFFFFF',
33971
+ backgroundColor: '#FFFFFF',
33961
33972
  borderWidth: '2px',
33962
33973
  borderColor: '#FFAA10'
33963
33974
  },
@@ -33968,13 +33979,13 @@ var STYLE_MAP = exports.STYLE_MAP = {
33968
33979
  },
33969
33980
  orange: {
33970
33981
  default: {
33971
- // backgroundColor: '#FF8225'
33982
+ backgroundColor: '#FF8225'
33972
33983
  },
33973
33984
  base: {
33974
- // backgroundColor: '#FFF0E6'
33985
+ backgroundColor: '#FFF0E6'
33975
33986
  },
33976
33987
  plain: {
33977
- // backgroundColor: '#FFFFFF',
33988
+ backgroundColor: '#FFFFFF',
33978
33989
  borderWidth: '2px',
33979
33990
  borderColor: '#FF8225'
33980
33991
  },
@@ -33985,13 +33996,13 @@ var STYLE_MAP = exports.STYLE_MAP = {
33985
33996
  },
33986
33997
  tomato: {
33987
33998
  default: {
33988
- // backgroundColor: '#FF6A4C'
33999
+ backgroundColor: '#FF6A4C'
33989
34000
  },
33990
34001
  base: {
33991
- // backgroundColor: '#FFEaE6'
34002
+ backgroundColor: '#FFEaE6'
33992
34003
  },
33993
34004
  plain: {
33994
- // backgroundColor: '#FFFFFF',
34005
+ backgroundColor: '#FFFFFF',
33995
34006
  borderWidth: '2px',
33996
34007
  borderColor: '#FF6A4C'
33997
34008
  },
@@ -34002,13 +34013,13 @@ var STYLE_MAP = exports.STYLE_MAP = {
34002
34013
  },
34003
34014
  gray: {
34004
34015
  default: {
34005
- // backgroundColor: '#7C879B'
34016
+ backgroundColor: '#7C879B'
34006
34017
  },
34007
34018
  base: {
34008
- // backgroundColor: '#CFD7E6'
34019
+ backgroundColor: '#CFD7E6'
34009
34020
  },
34010
34021
  plain: {
34011
- // backgroundColor: '#FFFFFF',
34022
+ backgroundColor: '#FFFFFF',
34012
34023
  borderWidth: '2px',
34013
34024
  borderColor: '#7C879B'
34014
34025
  },
@@ -34053,13 +34064,13 @@ var STYLE_MAP = exports.STYLE_MAP = {
34053
34064
  },
34054
34065
  colmo: {
34055
34066
  default: {
34056
- // backgroundColor: '#B35336'
34067
+ backgroundColor: '#B35336'
34057
34068
  },
34058
34069
  base: {
34059
- // backgroundColor: '#292c30'
34070
+ backgroundColor: '#292c30'
34060
34071
  },
34061
34072
  plain: {
34062
- // backgroundColor: 'transparent',
34073
+ backgroundColor: 'transparent',
34063
34074
  borderWidth: '2px',
34064
34075
  borderColor: '#B35336'
34065
34076
  },
@@ -51384,8 +51395,7 @@ module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c
51384
51395
  key: 'line' + index,
51385
51396
  staticClass: " weex-ct weex-div",
51386
51397
  class: ['step-line', _vm.showLine && 'hline'],
51387
- style: (Object.assign({}, item.lineStyles,
51388
- _vm.linePos[index])),
51398
+ style: (_vm._px2rem(Object.assign(item.lineStyles, _vm.linePos[index]), 75)),
51389
51399
  attrs: {
51390
51400
  "weex-type": "div"
51391
51401
  }