<template>
  <!-- 添加或修改项目信息对话框 -->
  <el-dialog title="公告更新维护维护" height="400px" v-model="visible" width="1000px" append-to-body draggable>
    <div class="form-container">
      <el-form ref="notificationRef" v-loading="loading" class="master-container" :model="form" label-width="80px">
        <el-form-item label="公告内容">
            <wangEditor
              class="WangEditor"
              @select="getRich"
              ref="editorRef"
              :editValue="editValue"
            />
          </el-form-item>
      </el-form>
    </div>
    <template #footer>
      <el-button type="primary" icon="Check" @click="handleSave">确 定</el-button>
      <el-button icon="Close" @click="handleCancel">取 消</el-button>
    </template>
  </el-dialog>
</template>
<script setup>
import {
  updateNotification,
} from "@/api/business/notification";
import { onMounted, reactive, ref, watch, nextTick } from "vue";
import wangEditor from "./wangEditor";
import WangEditor from "./wangEditor.vue";
const { proxy } = getCurrentInstance()
/** 父组件传参 */
const props = defineProps({
  getList: {
    type: Function,
    default: () => {},
  },
});
const { getList } = toRefs(props);
const emit = defineEmits(['handleSaveSuccess'])

/** 工序表单变量 */
const loading = ref(false)
const visible = ref(false)
const editorRef = ref(null);
const editValue = ref("");
const data = reactive({
  form: {},

})
const { form } = toRefs(data)
/***********************  方法区  ****************************/
/** 打开抽屉 */
function open(data) {
  console.log(data)
  visible.value = true
  form.value = proxy.deepClone(data)
  reset()
  editValue.value = form.value.content
  console.log("999",editValue.value)
}

/** 取消按钮 */
function handleCancel() {
  visible.value = false
  reset()
}
watch(
  props,
  (newUser, oldUser) => {
    if (props.dataRow && props.dataRow.id) {
      // 富文本回显
      form.value.content = props.dataRow.content;
      editValue.value = form.value.content;
    }
  },
  {
    deep: true,
    immediate: true,
  }
);
//当编辑器的内容更新时，获取该值
const getRich = function (value) {
  form.value.updateContent = value;
};

/** 表单重置 */
function reset() {
  if (editorRef.value) {
    console.log("999")
    console.log(editorRef.value)
    editorRef.value.valueHtml = form.value.content
      }
}

/** 提交按钮 */
function handleSave() {
  updateNotification(form.value)
.then((response) => {
  if(response.code === 200){
    proxy.$modal.msgSuccess("修改成功");
    visible.value = false;
    emit('handleSaveSuccess')
  }
})
}
/** 暴露给父组件的方法 */
defineExpose({
  open
})
</script>
