50 lines
1.3 KiB
Vue
50 lines
1.3 KiB
Vue
<template>
|
||
<!-- 底部fixed操作条，包含发布选项，普通文字加icon加标签选项 -->
|
||
<view class="cu-bar tabbar margin-bottom-xl bg-white fixed-bottom-bar">
|
||
<view class="action text-gray add-action" v-for="(item, index) in moduleBarInfos" :key="index"
|
||
v-if="item.action === 'add'">
|
||
<button class="cu-btn uni-bg-color shadow" :class="'cuIcon-' + item.cuIcon"></button>
|
||
{{item.name}}
|
||
</view>
|
||
<view class="action uni-text-color" v-else-if="index === 0">
|
||
<view :class="'cuIcon-' + item.cuIcon">
|
||
<view class="cu-tag badge" v-if="item.countTag">{{item.countTag > 99 ? '99+' : item.countTag}}</view>
|
||
</view>
|
||
{{item.name}}
|
||
</view>
|
||
<view class="action text-gray" v-else-if="index > 0">
|
||
<view :class="'cuIcon-' + item.cuIcon">
|
||
<view class="cu-tag badge" v-if="item.countTag">{{item.countTag > 99 ? '99+' : item.countTag}}</view>
|
||
</view>
|
||
{{item.name}}
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: "module-bar",
|
||
props: {
|
||
moduleBarInfos: {
|
||
type: Array,
|
||
default: []
|
||
}
|
||
},
|
||
data() {
|
||
return {};
|
||
},
|
||
methods: {
|
||
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.fixed-bottom-bar {
|
||
position: fixed;
|
||
width: 100%;
|
||
bottom: 0;
|
||
margin-bottom: 0;
|
||
}
|
||
</style>
|