<template>
  <el-dialog

    :modal="true"

    :close-on-click-modal="false"
    :close-on-press-escape="false"
    destroy-on-close

    title="服务状态监控详情"
    :model-value="dialogVisible"

    :before-close="handleClose"

  >
   <div class="form"> <diy-el-form :span="24" v-model:model-form="forms" :forms="dataServiceStateWatchDetailDialogFormConfig"/></div>
    <template #footer>
      <el-button :icon="SuccessFilled" @click="changeD">确定</el-button>
      <el-button @click="handleClose" :icon="Close">取消</el-button>
    </template>
  </el-dialog>
</template>

<script>
import {Close, SuccessFilled} from "@element-plus/icons-vue";
import DiyElForm from "@/components/common/DiyElForm.vue";
import {onBeforeMount, onMounted, ref} from "vue";
import {dataServiceStateWatchDetailDialogForm} from "@/data/all-forms";
import {useDetailOrEdit} from "@/unit/use-method/usePagination";

export default {
  name: "DataServiceStateWatchDetailDialog",
  components: {DiyElForm},
  computed: {
    Close() {
      return Close
    },
    SuccessFilled() {
      return SuccessFilled
    }
  },
  props:{
    dialogVisible:{

    },
    currentDialogOpObj:{

    },
    dialogOperationType:{

    }

  },
  setup(props,{emit}){

    onMounted(() => {
      console.log('onMounteddialog')
      dataServiceStateWatchDetailDialogFormConfig.value.formAttrs.disabled = props.dialogOperationType === 'detail'
      forms.value = {
        ...props.currentDialogOpObj,
        STATENAME:props.currentDialogOpObj.STATE === '1'?'正常':'异常',
        SERVICENAME:props.currentDialogOpObj.SERVICE_TYPE === '1'?'共享服务':(props.currentDialogOpObj.SERVICE_TYPE === '2'?'转发服务':props.currentDialogOpObj.SERVICE_TYPE),
        IS_SOVLED:props.currentDialogOpObj.IS_SOVLED || '2'

      }
    })
    const forms = ref({})
    const dataServiceStateWatchDetailDialogFormConfig = ref({...dataServiceStateWatchDetailDialogForm})

   function changeD() {
      emit('changeD',forms.value)
   }
    function handleClose() {
      emit('update:dialogVisible',false)
    }
    return {
      handleClose,
      forms,
      dataServiceStateWatchDetailDialogFormConfig,
      changeD
    }
  }
}
</script>

<style scoped lang="scss">
.form{
  padding: 0 15%;
}
</style>
