<template>
  <el-switch
    class="bg-switch-ele"
    v-model="value"
    :active-value="1"
    :inactive-value="0"
    inline-prompt
    :active-text="activeText"
    :inactive-text="inactiveText"
    @change="changeState" />
</template>

<script setup>
import { onMounted, reactive, toRefs, watch } from "vue";

const props = defineProps({
  modelValue: {
    type: Number,
    default: 0,
  },
  activeText: {
    type: String,
    default: "是",
  },
  inactiveText: {
    type: String,
    default: "否",
  },
  rowId: {
    type: Number,
    default: null,
  },
});
const state = reactive({
  value: 1,
});
const emit = defineEmits(["changeState"]);
const changeState = () => {
  if (props.rowId) {
    let params = {
      state: state.value,
      id: props.rowId,
    };
    emit("changeState", params);
  } else {
    emit("changeState", state.value);
  }
};
onMounted(() => {
  state.value = props.modelValue;
});
const { value } = toRefs(state);
</script>
