Skip to content

Commit

Permalink
feat: stash
Browse files Browse the repository at this point in the history
  • Loading branch information
moyus committed Sep 22, 2018
1 parent b649693 commit 0f5366f
Show file tree
Hide file tree
Showing 10 changed files with 155 additions and 129 deletions.
57 changes: 14 additions & 43 deletions components/bill/demo/cases/demo0.vue
Original file line number Diff line number Diff line change
@@ -1,47 +1,25 @@
<template>
<div class="md-example-child md-example-child-bill-0">
<md-bill
name="借款电子票据"
title="借款电子票据"
no="12345689"
water-mark="MAND-MOBILE"
>
<div>
<md-field-item
title="借款金额"
value="¥30,000"
align="right"
></md-field-item>
<md-field-item
title="收款账户"
align="right"
customized
>
<md-icon name="bank-zs" style="margin-right:10px;"></md-icon>招商银行(尾号xxxx)
</md-field-item>
<md-field-item
title="借款期数"
value="12期"
align="right"
></md-field-item>
<md-field-item
title="正常还款总息"
value="¥140.50"
align="right"
></md-field-item>
<md-field-item
title="还款"
align="right"
customized
>
<md-tag size="tiny" shape="fillet" type="fill" style="margin-right:10px;">首次</md-tag>
¥404.50(9月22日)
</md-field-item>
</div>
<div slot="description">
<md-field-item title="借款金额" content="¥30,000" />
<md-field-item title="收款账户">
<md-icon name="bank-zs" style="margin-right:10px;"></md-icon>招商银行(尾号xxxx)
</md-field-item>
<md-field-item title="借款期数" content="12期" />
<md-field-item title="正常还款总息" content="¥140.50" />
<md-field-item title="还款">
<md-tag size="tiny" shape="fillet" type="fill" style="margin-right:10px;">首次</md-tag>
¥404.50(9月22日)
</md-field-item>
<template slot="description">
1 账单生成后显示在滴水贷首页,请按时还款避免逾期。 <br>
2 整笔账单还款完成后,额度将恢复。暂不支持额度实时恢复。<br>
3 还款日将自动扣款,扣款顺序优先余额,其次还款账户:工商银行 (尾号xxxx)。
</div>
3 还款日将自动扣款,扣款顺序优先余额,其次还款账户:工商银行 (尾号xxxx)。
</template>
</md-bill>
</div>
</template>
Expand All @@ -59,10 +37,3 @@ export default {
},
}
</script>

<style lang="stylus">
.md-example-child-bill-0
.md-bill
.bill-radius i
background #f3f4f5 !important
</style>
Expand Down
139 changes: 75 additions & 64 deletions components/bill/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -3,42 +3,40 @@
class="md-bill"
:content="waterMark"
>
<md-field
:title="name"
:value="no ? `NO.${no}` : ''"
plain
>
<div class="bill-radius">
<i></i><i></i>
</div>
<div class="bill-detail">
<header class="md-bill-header" slot="header">
<h4 class="md-bill-title" v-if="title" v-text="title"></h4>
<div class="md-bill-no" v-if="no">NO.{{no}}</div>
</header>
<div class="md-bill-neck">
<span></span>
</div>
<div class="md-bill-content">
<div class="md-bill-detail">
<slot></slot>
</div>
<div class="bill-description">
<footer v-if="$slots.description" class="md-bill-description">
<slot name="description"></slot>
</div>
</md-field>
</footer>
</div>
<div slot="watermark" slot-scope="props" v-if="!!$scopedSlots.watermark">
<slot name="watermark" @index="1"></slot>
</div>
</md-water-mark>
</template>

<script>import Field from '../field'
import FieldItem from '../field/item'
<script>import FieldItem from '../field-item'
import WaterMark from '../water-mark'
export default {
name: 'md-bill',
components: {
[Field.name]: Field,
[FieldItem.name]: FieldItem,
[WaterMark.name]: WaterMark,
},
props: {
name: {
title: {
type: String,
default: '',
},
Expand All @@ -59,53 +57,66 @@ export default {
position relative
background bill-bg
overflow hidden
.md-field.is-plain
position relative
z-index 2
background-color transparent
.md-field-title
.md-field-title-inner
.title
color bill-name-color
font-size bill-name-font-size
font-weight font-weight-medium
font-family Songti SC
.value
display flex
flex-direction column
justify-content center
color bill-no-color
font-size bill-no-font-size
.md-field-content
position relative
.md-field-item
padding 0
.bill-radius
position absolute
top -18px
left 0
right 0
z-index 3
i
position relative
width 36px
height 36px
background color-bg-inverse
border-radius radius-circle
&:first-of-type
float left
left -18px
&:last-of-type
float right
right -18px
.bill-detail
padding 20px 0 40px 0
margin 0 field-padding-plain-h
hairline(bottom, field-item-border-color)
.bill-description
padding 40px field-padding-plain-h
color bill-description-color
font-size bill-description-font-size
line-height 1.5
.md-bill-header
display flex
align-items center
justify-content space-between
padding 20px 32px 0
.md-bill-title
color bill-name-color
font-size bill-name-font-size
font-weight font-weight-medium
font-family Songti SC
.md-bill-no
color bill-no-color
font-size bill-no-font-size
.md-bill-neck
position relative
height 36px
padding 10px
margin 0 18px
background-color bill-bg
box-sizing content-box
span
position absolute
display block
top 50%
left 10px
right 10px
height 1px
hairline(bottom, field-item-border-color)
&::before,
&::after
content ''
display block
position absolute
top 0
width 36px
height 36px
border-radius 18px
&::before
left -72px
box-shadow 10px 0 0 bill-bg
&::after
right -72px
box-shadow 10px 0 0 bill-bg
.md-bill-content
padding 0 32px 20px 32px
background-color bill-bg
.md-bill-detail
padding-bottom 40px
.md-bill-description
position relative
padding-top 40px
line-height 1.5
color bill-description-color
font-size bill-description-font-size
hairline(top, field-item-border-color)
</style>
Expand Down
2 changes: 1 addition & 1 deletion components/cell-item/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<div class="md-cell-item-left" v-if="$slots.left">
<slot name="left"></slot>
</div>
<div class="md-cell-item-content">
<div v-if="title || brief || $slots.default" class="md-cell-item-content">
<p class="md-cell-item-title" v-if="title" v-text="title"></p>
<p class="md-cell-item-brief" v-if="brief" v-text="brief"></p>
<slot></slot>
Expand Down
4 changes: 3 additions & 1 deletion components/drop-menu/demo/cases/demo0.vue
Original file line number Diff line number Diff line change
Expand Up @@ -29,9 +29,11 @@ export default {
text: '一级选项1',
options: [
{
value: '0',
text: '二级选项1',
},
{
value: '1',
text: '二级选项2',
},
],
Expand All @@ -53,4 +55,4 @@ export default {
},
},
}
</script>
</script>
Expand Down
11 changes: 10 additions & 1 deletion components/drop-menu/demo/cases/demo1.vue
Original file line number Diff line number Diff line change
Expand Up @@ -30,21 +30,27 @@ export default {
text: '排量',
options: [
{
value: '0',
text: '1.6L',
},
{
value: '1',
text: '1.8L',
},
{
value: '2',
text: '2.0L',
},
{
value: '3',
text: '1.2T',
},
{
value: '4',
text: '1.4T',
},
{
value: '5',
text: '1.6T',
},
],
Expand All @@ -53,12 +59,15 @@ export default {
text: '变速箱',
options: [
{
value: '7',
text: '手动挡',
},
{
value: '8',
text: '自动挡',
},
{
value: '9',
text: '手自一体',
},
],
Expand All @@ -67,4 +76,4 @@ export default {
}
},
}
</script>
</script>
Expand Down
8 changes: 7 additions & 1 deletion components/drop-menu/demo/cases/demo2.vue
Original file line number Diff line number Diff line change
Expand Up @@ -30,22 +30,28 @@ export default {
text: '排量',
options: [
{
value: '0',
text: '1.6L',
},
{
value: '1',
text: '1.8L',
},
{
value: '2',
text: '2.0L',
disabled: true,
},
{
value: '3',
text: '1.2T',
},
{
value: '4',
text: '1.4T',
},
{
value: '5',
text: '1.6T',
},
],
Expand All @@ -58,4 +64,4 @@ export default {
}
},
}
</script>
</script>
Expand Down
4 changes: 3 additions & 1 deletion components/drop-menu/demo/cases/demo3.vue
Original file line number Diff line number Diff line change
Expand Up @@ -34,9 +34,11 @@ export default {
text: '一级选项1',
options: [
{
value: '0',
text: '二级选项1',
},
{
value: '1',
text: '二级选项2',
},
],
Expand Down Expand Up @@ -64,4 +66,4 @@ export default {
font-size 20px
color #999
text-align center
</style>
</style>
Expand Down
Loading

0 comments on commit 0f5366f

Please sign in to comment.