<template>
  <div><span>{{ $t(show_name) }}</span> <q-checkbox v-model="val" @click="send" /></div>
</template>


<script lang="ts">
import {
  defineComponent,
  ref,
  watch,
  computed,
  defineProps,
  withDefaults,
  reactive,
  onMounted,
  onBeforeUnmount,
} from "vue";
import { useStore } from "src/store";
import { useI18n } from "vue-i18n";
import vue3ResizeDrag from "/src/third_lib/vue3-resize-drag/components/vue3-resize-drag/index.vue";
import GlobalData from "src/common/GlobalData";
export default defineComponent({
  name: "DebuggingItem",
  components: {
    vue3ResizeDrag,
  },
  props: {
    name: {
      type: String,
      default: ''
    },
    value: {
      type: String,
      default: ''
    }
  },
  setup(props) {
    let set = GlobalData.getInstance().getCurrentClient();
    let $store = useStore();
    let $t = useI18n();
    const val = ref(false)
    const show_name = computed(() => {
      let tmp=""
      if(props.name.indexOf("@") != -1){
        tmp=props.name.split("@")[1]
      }else{
        tmp=props.name
      }
      return tmp
    })
    val.value=props.value=="1"?true:false
    const send = () => {
      set?.SetBlendingOption(props.name, val.value ? "1" : "0");

    }
    const use_sessionStorage=()=>{
      if(sessionStorage.Debugging){
        let tmp=JSON.parse(sessionStorage.Debugging);
        for (let index = 0;index < tmp.length; index++) {
          if(Object.keys(tmp[index])[0]==props.name){
            val.value=Object.values(tmp[index])[0]=="1"?true:false
            break
          }
        }
      }
    }
    onMounted(()=>{
      use_sessionStorage()
    })
    onBeforeUnmount(() => {
        let key=props.name
        let value=val.value
      if(sessionStorage.Debugging){
        let tmp=JSON.parse(sessionStorage.Debugging);
        let count=0;
        for (let index = 0;index < tmp.length; index++) {
          if(Object.keys(tmp[index])[0]==key){
            tmp[index]={[key]:value}
            break
          }
          count=index
        }
        if(count==tmp.length-1)tmp.push({[key]:value});
        sessionStorage.Debugging = JSON.stringify(tmp);
      }else{
        sessionStorage.Debugging = JSON.stringify([{[key]:value}]);
      }

    });
    return {
      send,
      val,
      show_name,
      ...props
    }
  }
})
</script>
