初始化商家端

components/benben-message-num/benben-message-num.vue

@@ -0,0 +1,41 @@
+<template>
+  <text :style="styleInfo" v-if="messageNum > 0" class="benben_message_num">
+    {{ messageNum > 99 ? '···' : messageNum }}
+  </text>
+</template>
+<script>
+export default {
+  name: 'benben-message-num',
+  props: {
+    messageNum: { type: [String, Number], default: 0 },
+    size: { type: [String, Number], default: '24' }, //消息字体大小
+    color: { type: [String, Number], default: '#eee' },
+    backgroundColor: { type: [String, Number], default: 'red' },
+  },
+  components: {},
+  computed: {
+    styleInfo() {
+      let _size = this.size / 0.8 + 'rpx'
+      return `background-color:${this.backgroundColor};font-size:${this.size}rpx;color:${this.color};width:${_size};height:${_size};`
+    },
+  },
+  data() {
+    return {}
+  },
+  watch: {},
+  methods: {},
+  created() {},
+  beforeDestroy() {},
+}
+</script>
+<style lang="scss" scoped>
+.benben_message_num {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 50%;
+  overflow: hidden;
+  font-weight: 500;
+	padding: 4rpx;
+}
+</style>