Gaoxs
4 years ago
10 changed files with 205 additions and 161 deletions
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,65 +1,70 @@ |
|||||||
<template> |
<template> |
||||||
<view> |
<view class="cu-custom" :style="[{height:CustomBar + 'px'}]"> |
||||||
<view class="cu-custom" :style="[{height:CustomBar + 'px'}]"> |
<view class="cu-bar fixed" :style="style" :class="[bgImage!=''?'none-bg text-white bg-img':'',bgColor]"> |
||||||
<view class="cu-bar fixed" :style="style" :class="[bgImage!=''?'none-bg text-white bg-img':'',bgColor]"> |
<view class="action" @tap="BackPage" v-if="isBack"> |
||||||
<view class="action" @tap="BackPage" v-if="isBack"> |
<text class="cuIcon-back"></text> |
||||||
<text class="cuIcon-back"></text> |
<slot name="backText"></slot> |
||||||
<slot name="backText"></slot> |
</view> |
||||||
</view> |
<view class="content" :style="[{top:StatusBar + 'px'}]"> |
||||||
<view class="content" :style="[{top:StatusBar + 'px'}]"> |
<slot name="content"></slot> |
||||||
<slot name="content"></slot> |
</view> |
||||||
</view> |
<slot name="right"></slot> |
||||||
<slot name="right"></slot> |
</view> |
||||||
</view> |
</view> |
||||||
</view> |
</template> |
||||||
</view> |
|
||||||
</template> |
<script> |
||||||
|
export default { |
||||||
<script> |
data() { |
||||||
export default { |
return { |
||||||
data() { |
StatusBar: this.StatusBar, |
||||||
return { |
CustomBar: this.CustomBar |
||||||
StatusBar: this.StatusBar, |
}; |
||||||
CustomBar: this.CustomBar |
}, |
||||||
}; |
name: 'cu-custom', |
||||||
}, |
computed: { |
||||||
name: 'cu-custom', |
style() { |
||||||
computed: { |
var StatusBar = this.StatusBar; |
||||||
style() { |
var CustomBar = this.CustomBar; |
||||||
var StatusBar= this.StatusBar; |
var bgImage = this.bgImage; |
||||||
var CustomBar= this.CustomBar; |
var style = `height:${CustomBar}px;padding-top:${StatusBar}px;background:${this.bgColor} ;`; |
||||||
var bgImage = this.bgImage; |
if (this.bgImage) { |
||||||
var style = `height:${CustomBar}px;padding-top:${StatusBar}px;`; |
style = `${style}background-image:url(${bgImage});`; |
||||||
if (this.bgImage) { |
} |
||||||
style = `${style}background-image:url(${bgImage});`; |
return style |
||||||
} |
} |
||||||
return style |
}, |
||||||
} |
props: { |
||||||
}, |
bgColor: { |
||||||
props: { |
type: String, |
||||||
bgColor: { |
default: '' |
||||||
type: String, |
}, |
||||||
default: '' |
isBack: { |
||||||
}, |
type: [Boolean, String], |
||||||
isBack: { |
default: false |
||||||
type: [Boolean, String], |
}, |
||||||
default: false |
bgImage: { |
||||||
}, |
type: String, |
||||||
bgImage: { |
default: '' |
||||||
type: String, |
}, |
||||||
default: '' |
}, |
||||||
}, |
methods: { |
||||||
}, |
BackPage() { |
||||||
methods: { |
uni.navigateBack({ |
||||||
BackPage() { |
delta: 1 |
||||||
uni.navigateBack({ |
}); |
||||||
delta: 1 |
} |
||||||
}); |
} |
||||||
} |
} |
||||||
} |
</script> |
||||||
} |
|
||||||
</script> |
<style> |
||||||
|
.fixed{ |
||||||
<style> |
position: fixed; |
||||||
|
top:0; |
||||||
</style> |
left:0; |
||||||
|
right:0; |
||||||
|
z-index: 99; |
||||||
|
|
||||||
|
} |
||||||
|
</style> |
||||||
|
Loading…
Reference in new issue