|
|
|
<!--
|
|
|
|
* @Author: ch
|
|
|
|
* @Date: 2022-03-25 10:11:37
|
|
|
|
* @LastEditors: ch
|
|
|
|
* @LastEditTime: 2022-04-24 15:36:57
|
|
|
|
* @Description: file content
|
|
|
|
-->
|
|
|
|
<template>
|
|
|
|
<view class="header">
|
|
|
|
<image class="header--back" v-if="back" src="@/static/common/back.png" @click="$Router.back()"></image>
|
|
|
|
<slot name="custom">
|
|
|
|
<text class="header--title">{{title}}</text>
|
|
|
|
<view class="header--operation">
|
|
|
|
<slot name="operation"></slot>
|
|
|
|
</view>
|
|
|
|
</slot>
|
|
|
|
</view>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
|
|
export default {
|
|
|
|
props : {
|
|
|
|
title : {
|
|
|
|
type : String,
|
|
|
|
default : ''
|
|
|
|
},
|
|
|
|
back : {
|
|
|
|
type : Boolean,
|
|
|
|
default : true
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
.header{
|
|
|
|
height: 88rpx;
|
|
|
|
padding: 0 40rpx;
|
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
|
|
|
align-items: center;
|
|
|
|
background: $color-grey1;
|
|
|
|
position: sticky;
|
|
|
|
top: var(--window-top);
|
|
|
|
z-index: 999;
|
|
|
|
&--back{
|
|
|
|
width: 14rpx;
|
|
|
|
height: 28rpx;
|
|
|
|
margin-right: 36rpx;
|
|
|
|
}
|
|
|
|
&--title{
|
|
|
|
flex: 1;
|
|
|
|
text-align: center;
|
|
|
|
font-size: 36rpx;
|
|
|
|
font-weight: bold;
|
|
|
|
}
|
|
|
|
&--operation{
|
|
|
|
position: absolute;
|
|
|
|
right: 40rpx;
|
|
|
|
top: 0;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
</style>
|