<template>
  <div>
    <span class="dot" :class="injectData.status === 1 ? 'red' : 'green'"></span>
    <span>{{ state }}</span>
  </div>
</template>
<script>
export default {
  name: "StatusBtn2",
  props: {
    injectData: {
      type: Object,
      default: () => ({}),
    },
  },
  computed: {
    state() {
      return this.injectData.status === 1 ? "关闭" : "开启";
    },
  },
};
</script>
<style scoped>
.dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 3px;
  vertical-align: middle;
  margin-right: 8px;
}
.green {
  background: #10dc76;
}
.red {
  background: #ff5656;
}
</style>
