<template>
  <div>
    <div v-show="ready">
      <a-row v-if="this.readonly" class="editor-action-container" type="flex" justify="space-between">
        <a-col class="editor-tools">
          <a-space>
            <template v-if="resList.length > 0">
              <a-select
                style="width: 200px"
                v-model="toggleResId"
                placeholder="请选择文档"
                show-search
                @change="changeRes"
              >
                <a-select-option v-for="item of resListCp" :key="item.value" :value="item.value">{{ item.label }}</a-select-option>
              </a-select>
              <!--              <template v-if="this.modeType !== 'readonly' && this.resId !== -1">-->
              <!--                <a-button icon="plus" @click="addRes"/>-->
              <!--              </template>-->
            </template>
            <a-radio-group
              class="custom-radio-group"
              v-show="showModeChoose"
              button-style="solid"
              @change="changeMode"
              v-model="modeType">
              <a-radio-button v-for="item of modeList" :key="item.value" :value="item.value">
                {{ item.label }}
              </a-radio-button>
            </a-radio-group>
          </a-space>
        </a-col>
        <a-col class="editor-action-button">
          <a-space>
            <template v-if="this.modeType !== 'readonly'">
              <!--              <a-button-->
              <!--                type="primary"-->
              <!--                v-if = "userTemplateVisible"-->
              <!--                @click="useTemplateData"-->
              <!--              >-->
              <!--                使用-->
              <!--              </a-button>-->
              <a-button type="primary" @click="Recording" v-if="canRecord" v-model="recording">
                {{ recording? '停止' : '录音' }}
              </a-button>
              <a-button type="primary" @click="openRenameModal" v-if="this.resId !== -1">
                重命名
              </a-button>
              <!-- 组合按钮容器 -->
              <div class="save-btn-main">
                <!-- 保存按钮 (左侧) -->
                <a-button
                  type="primary"
                  class="save-btn-main"
                  @click="showSaveModal('normal')"
                >
                  保存
                </a-button>

                <!-- 下拉部分 (右侧) -->
                <!-- 下拉触发部分 -->
                <template v-if="modeType !== 'design'">
                  <a-dropdown
                    :trigger="['click']"
                    placement="bottomRight">
                    <a-button
                      type="primary"
                      class="dropdown-trigger-btn">
                      <a-icon type="down" />
                    </a-button>
                    <a-menu slot="overlay">
                      <a-menu-item @click="showSaveModal('template')">
                        保存并作为模板
                      </a-menu-item>
                    </a-menu>
                  </a-dropdown>
                </template>
              </div>
              <a-modal
                title="保存"
                :visible="saveVisible"
                :confirm-loading="false"
                @ok="handleSaveConfirm"
                @cancel="saveVisible = false"
              >
                <a-form-item label="文件名" :label-col="{ span: 4 }" :wrapper-col="{ span: 20 }">
                  <a-input
                    v-model="fileName"
                    placeholder="请输入文件名"
                    @pressEnter="handleSaveConfirm"
                  />
                </a-form-item>
              </a-modal>
            </template>
            <a-button type="primary" @click="print">
              打印
            </a-button>
            <a-button @click="refresh">
              刷新
            </a-button>
          </a-space>
          <a-dropdown>
            <a-menu slot="overlay" @click="handleExportMenuClick">
              <a-menu-item key="exportPdf">导出为Pdf</a-menu-item>
              <a-menu-item key="exportWord">导出为Word</a-menu-item>
              <a-menu-item key="exportHtmlWithStyle">导出为Html</a-menu-item>
            </a-menu>
            <a-button style="margin-left: 8px"> 导出 <a-icon type="down" /> </a-button>
          </a-dropdown>
        </a-col>
      </a-row>
      <a-divider/>
      <a-spin tip="加载中，马上好" :spinning="loading">
        <iframe
          id="x-editor"
          :src="iframeSrc"
          v-bind="objectOfAttrs"
          @load="onload"
          :style="iframeStyle">
        </iframe>
      </a-spin>
    </div>
    <div v-show="!ready">
      <a-empty description="请选择文书" />
    </div>
    <a-modal
      :destroyOnClose="true"
      :title="this.resDataModalMode === 'modify' ? '修改文档' : '新建文档'"
      :visible="resDataModalVisible"
      okText="提交"
      @cancel="resDataModalVisible = false"
      @ok="onSubmit">
      <a-form-model ref="resModifyForm" :model="modifyResModel" :rules="resRules">
        <a-form-model-item prop="f_file_name" label="文档名">
          <a-input v-model="modifyResModel.f_file_name" placeholder="请输入文档名"/>
        </a-form-model-item>
      </a-form-model>
    </a-modal></div>
</template>

<script>

import { runLogic } from '@vue2-client/services/api/common'
import { initDiagnosisDropdown } from './diagnosisAutocomplete'

export default {
  name: 'XHisEditor',
  props: {
    hideEditorToolbar: {
      type: Boolean,
      default: true
    }
  },
  computed: {
    resListCp () {
      const list = this.resList
      if (this.resId === -1) {
        list.push({
          label: '未保存文档*', value: -1
        })
      }
      return list
    },
    // 过滤字段列表 - 提取重复逻辑
    filterFields () {
      return this.fieldFilter ? this.fieldFilter.split(',').map(f => f.trim()).filter(f => f) : []
    },
    // iframe样式
    iframeStyle () {
      const baseStyle = {
        height: 'calc(-200px - 3rem + 100vh)'
      }

      return baseStyle
    },
    // iframe src
    iframeSrc () {
      let src = '/his/editor/editor.html'

      if (this.hideEditorToolbar) {
        // 使用最直接的参数名，确保编辑器能识别
        src += '?toolbar=false&menubar=false&hideToolbar=true&hideMenubar=true'
        console.log('iframe URL设置为隐藏工具栏:', src)
      } else {
        src += '?toolbar=true&menubar=true'
        console.log('iframe URL设置为显示工具栏:', src)
      }

      return src
    }
  },
  created() {
    // 初始化字段过滤器
    this.fieldFilter = this.$attrs.fieldFilter
  },
  mounted() {
    // 组件挂载时不需要隐藏，等待iframe onload事件
  },
  beforeDestroy() {
    // 清理防抖定时器
    if (this.debounceTimer) {
      clearTimeout(this.debounceTimer)
      this.debounceTimer = null
    }
    // 重置输入法状态
    this.isComposing = false
  },
  data () {
    return {
      temporaryParameter: {},
      canRecord: false,
      recording: false, // 是否正在录音
      readonly: false,
      ready: false,
      loading: false,
      resDataModalMode: 'modify',
      resDataModalVisible: false,
      saveVisible: false,
      // 使用按钮显隐控制
      // userTemplateVisible: false,
      objectOfAttrs: {
        width: '100%',
        height: '650vh',
        frameborder: 0
      },
      // 数据模式
      modeType: 'form',
      // 是否显示模式切换功能
      showModeChoose: true,
      // 是否作为模板 1 是，0 否
      isTemplate: 0,
      // 模板id
      templateId: undefined,
      admissionId: undefined,
      // 保存类型
      saveType: 'normal',
      fileName: '',
      // 数据模式列表
      modeList: [
        {
          label: '预览',
          value: 'readonly'
        },
        {
          label: '表单',
          value: 'form'
        },
        {
          label: '设计',
          value: 'design'
        }
      ],
      // 编辑器实例
      editorRef: null,
      // 文档资源列表
      resList: [],
      // 文档资源ID
      resId: undefined,
      // 文档链接
      fileUrl: undefined,
      // 文档绑定数据
      bindObject: undefined,
      // 合并模板数据后文档数据
      assignBindObject: undefined,
      // 数据模式 template:模板编辑；data:数据编辑
      dataMode: undefined,
      // 保存数据调用的Logic名称
      saveDataLogicName: undefined,
      // 保存数据调用Logic传入的额外参数
      logicExtraParams: undefined,
      // 服务名
      serviceName: undefined,
      // 当前文档信息
      currResData: {},
      // 切换的文档id
      toggleResId: undefined,
      // 待提交的修改信息
      modifyResModel: {},
      codeData: {},
      resRules: {
        f_file_name: [{ required: true, message: '请输入文档名', trigger: 'blur' }],
      },
      // inputEnd 事件相关
      fieldFilter: undefined,
      debounceTimer: null,
      inputListenerSetup: false,
      isComposing: false // 标记是否正在输入中文（拼音输入中）
    }
  },
  //      初始化    保存后        加载文件后    诊断选择
  emits: ['init', 'saveafter', 'afterLoadFile', 'selected', 'inputEnd'],
  methods: {
    // 获取编辑器绑定数据 - 辅助方法
    getEditorData () {
      if (!this.editorRef || !this.editorRef.getBindObject) {
        return null
      }
      const bindData = this.editorRef.getBindObject()
      return bindData && typeof bindData === 'object' ? { ...bindData } : null
    },

    // 暴露给外部调用：设置绑定数据
    setFieldData(bindObject) {
      if (this.editorRef && bindObject) {
        this.editorRef.setBindObject(bindObject)
        if (bindObject.template) {
          for (const key of Object.keys(bindObject.template)) {
            this.editorRef.bindDataList(key, bindObject.template[key])
          }
        }
        // 更新本地数据
        this.bindObject = bindObject
        this.codeData = {}
        return true
      }
      return false
    },

    // 暴露给外部调用：设置单个字段
    setFieldValue(fieldNameOrData, value) {
      if (!this.editorRef) {
        return false
      }

      // 获取当前数据
      const currentData = this.getEditorData() || {}

      // 支持两种调用方式：
      // 1. setFieldValue('fieldName', 'value')
      // 2. setFieldValue({fieldName: 'value'})
      if (typeof fieldNameOrData === 'string' && value !== undefined) {
        // 方式1：字段名 + 值
        currentData[fieldNameOrData] = value
      } else if (typeof fieldNameOrData === 'object' && fieldNameOrData !== null) {
        // 方式2：对象形式 - 只更新指定的字段
        Object.assign(currentData, fieldNameOrData)
      } else {
        return false
      }

      // 重新设置数据
      this.editorRef.setBindObject(currentData)
      // 更新本地数据
      this.bindObject = currentData

      return true
    },

    // 暴露给外部调用：获取当前数据
    getFieldData() {
      return this.getEditorData()
    },

    // 暴露给外部调用：获取单个字段值
    getFieldValue(fieldName) {
      if (!fieldName) return null
      const data = this.getEditorData()
      return data ? data[fieldName] : null
    },
    runLogic,
    /* eslint-disable */
    async initDiagnosisAutocomplete (dropDownBoxParams) {
      console.log('dropDownBoxParams',dropDownBoxParams)
      if (!this.editorRef || !this.editorRef.document) {
        return
      }

      // 添加参数检查
      if (!dropDownBoxParams || !Array.isArray(dropDownBoxParams) || dropDownBoxParams.length === 0) {
        return
      }

      // 创建一个简单的自定义事件系统
      // 1. 创建一个隐藏的DOM元素作为事件通道
      const eventChannel = this.editorRef.document.createElement('div');
      eventChannel.id = 'diagnosis-event-channel';
      eventChannel.style.display = 'none';
      this.editorRef.document.body.appendChild(eventChannel);
      // 2. 在iframe文档中监听自定义事件
      const that = this;
      this.editorRef.document.addEventListener('diagnosis-selected', function(e) {
        if (e && e.detail) {
          that.$emit('selected', { item: e.detail, editor: that.editorRef });
          that.codeData = { ...that.codeData, ...{[e.detail.codeKey]: e.detail.code} }
        }
      });

      for (const param of dropDownBoxParams) {
        if (param.identificationCode && param.dataLogic) {
          try {
            let preliDiagnoData = null
            // 保留获取后端数据的逻辑
            await runLogic(param.dataLogic,
              {}, 'af-his').then(res => {
              preliDiagnoData = res
            })

            // 创建脚本元素
            const scriptElement = this.editorRef.document.createElement('script')

            // 注入自定义事件触发函数和初始化代码
            scriptElement.textContent = `
              // 定义一个函数来触发自定义事件
              function triggerDiagnosisSelected(data) {
                const event = new CustomEvent('diagnosis-selected', {
                  detail: data,
                  bubbles: true
                });
                document.dispatchEvent(event);
              }

              // 初始化诊断下拉菜单，使用自定义事件触发函数
              (${initDiagnosisDropdown.toString()})(
                editor,
                ${JSON.stringify(preliDiagnoData)},
                '${param.identificationCode}',
                triggerDiagnosisSelected
              );
            `;

            this.editorRef.document.body.appendChild(scriptElement);
          } catch (error) {
            console.error('初始化诊断自动完成失败:', error);
          }
        }
      }
    },
    showSaveModal (type) {
      this.saveType = type  // 记录当前保存类型
      if (type === 'template') {
        this.saveVisible = true
      }else {
        if (this.resId !== -1 || this.resId !== undefined) {
          this.save()
        } else {
          this.openAddResModal()
        }
      }

    },
    handleSaveConfirm () {
      if (!this.fileName.trim()) {
        this.$message.error('文件名不能为空')
        return
      }
      this.saveAsTemplate()
    },
    /* eslint-disable */
    // 初始化文档
    /**
     * 编辑器加载完成事件处理
     */
    onload (e) {
      if (e && e.target && e.target.contentWindow) {
        this.editorRef = e.target.contentWindow.editor
        this.$emit('init', {})

        // 隐藏工具栏
        if (this.hideEditorToolbar) {
          setTimeout(() => this.hideToolbar(), 500)
        }

        // 如果配置了字段过滤，延迟初始化监听器
        if (this.fieldFilter && this.fieldFilter.trim()) {
          setTimeout(() => {
            this.setupInputEndListener()
          }, 1000)
        }
      }
    },
    init (params, loadResList = true) {
      console.log("===============>",params)
      this.temporaryParameter = params
      this.canRecord = params.canRecord == undefined || params.canRecord == null? false : params.canRecord
      const {
        fileUrl,
        resId,
        currResData = {},
        bindObject,
        saveDataLogicName,
        logicExtraParams,
        dropDownBoxParams,
        serviceName,
        showModeChoose = true,
        modeType = 'form',
        fieldFilter
      } = params
      this.resId = resId
      if (bindObject) {
        this.dataMode = 'data'
        this.bindObject = bindObject
      } else {
        this.dataMode = 'template'
      }
      if (logicExtraParams?.admissionId !== undefined && logicExtraParams?.templateId !== undefined) {
        this.admissionId = logicExtraParams.admissionId
        this.templateId = logicExtraParams.templateId
      } else {
        console.warn('病例id:admissionId不存在或模板id:templateId不存在')
      }
      this.saveDataLogicName = saveDataLogicName
      this.logicExtraParams = logicExtraParams
      this.serviceName = serviceName
      this.showModeChoose = showModeChoose
      this.modeType = (modeType === "readonly!" ? "readonly" :modeType)
      this.readonly = (modeType !== "readonly!")

      // 设置字段过滤器
      this.fieldFilter = fieldFilter || this.$attrs.fieldFilter

      this.ready = true
      // 先加载文件
      this.loadFile(fileUrl, bindObject, currResData).then(async () => {
        // 文件加载完成后再初始化自动完成
        await this.initDiagnosisAutocomplete(dropDownBoxParams)
      })
      if(loadResList){
        this.loadResList()
      }
    },

    // 加载文档
    loadFile (fileUrl, bindObject, currResData) {
      this.loading = true
      return new Promise((resolve) => {
        this.editorRef.loadUrl(fileUrl).then(() => {
          if (bindObject) {
            this.editorRef.setBindObject(bindObject)
            if (bindObject.template) {
              for (const key of Object.keys(bindObject.template)) {
                this.editorRef.bindDataList(key, bindObject.template[key])
              }
            }
          }
          // 拿取多于模板中的数据
          const diff = this.bindObject? Object.fromEntries(
            Object.entries(this.bindObject)
              .filter(([key]) => !(key in this.editorRef.getBindObject()))
          ) : {}
          this.codeData = {...this.codeData,...diff}
          this.changeMode()
          this.fileUrl = fileUrl
          if (!currResData.f_file_name) {
            currResData.f_file_name = '未命名'
          }
          this.currResData = currResData
          this.loading = false
          this.$emit('afterLoadFile', {})

          // 文件加载完成后重新设置输入监听器
          if (this.fieldFilter && this.fieldFilter.trim()) {
            setTimeout(() => {
              this.setupInputEndListener()
            }, 500)
          }

          resolve()
        })
      })
    },
    // 保存并作为模板
    saveAsTemplate () {
      this.isTemplate = 1
      this.save()
    },
    // 加载文档列表
    loadResList () {
      runLogic('getTemplateListLogic', this.logicExtraParams, this.serviceName).then(res => {
        this.resList = res
        this.toggleResId = this.resId
      })
    },
    // 修改模式
    changeMode (e) {
      this.editorRef.execCommand(this.modeType)
    },
    // 启动录音功能
    async Recording () {
      this.recording = !this.recording
      if (this.recording) {
        const recording = await this.$recording.startRecording()
        this.$message.warn(recording.msg)
      } else {
        try {
          // 1. 获取录音和接口数据
          const recording = this.$recording.stopRecording()
          this.$message.warn(recording.msg)
          const data = await this.$recording.getRecordingData()
          const result = await this.runLogic('communacation', {record_content: data}, 'af-his')
          // 验证基础结构
          if (!result || typeof result.value !== 'string') {
            throw new Error('接口返回格式错误，缺少有效的value字段')
          }
          // 2. 处理外层JSON字符串（关键修复）
          let outerJsonStr = result.value
          // 修复1：处理布尔值
          outerJsonStr = outerJsonStr.replace(/\bTrue\b/g, 'true')
          // 修复2：移除所有控制字符
          outerJsonStr = outerJsonStr.replace(/[\x00-\x1F]/g, '')
          // 修复3：精准转义data字段内的双引号
          // 匹配 "data": "..." 结构并转义内容中的双引号
          outerJsonStr = outerJsonStr.replace(/"data":\s*"([^"]*)"/g, (match, content) => {
            // 转义内容中的双引号为\"
            const escapedContent = content.replace(/"/g, '\\"')
            return `"data": "${escapedContent}"`
          })
          // 直接在整个字符串里匹配 ```json{...}```
          const regex = /```json([\s\S]*?)```/
          const match = outerJsonStr.match(regex)
          let extractedJsonStr = ''
          if (match && match[1]) {
            extractedJsonStr = match[1].trim()
          }
          const outerObj = JSON.parse(extractedJsonStr)
          console.log("outerObj = ", outerObj)
          this.temporaryParameter.bindObject = {...this.temporaryParameter.bindObject, ...outerObj}
          this.init(this.temporaryParameter)
        } catch (e) {
          console.error('总错误:', e.message)
          this.$message.error(`解析失败: ${e.message}`)
        }
      }
    },
    // 打开文档信息修改面板
    openRenameModal () {
      this.resDataModalMode = 'modify'
      this.modifyResModel = {
        f_file_name: this.currResData.f_file_name
      }
      this.resDataModalVisible = true
    },
    // 提交文档信息修改
    onSubmit () {
      this.$refs.resModifyForm.validate(valid => {
        if (valid) {
          if (this.resDataModalMode === 'modify' && this.modifyResModel.f_file_name === this.currResData.f_file_name) {
            this.$message.warn('新文档名不能与原文档名一致！')
            return false
          }
          this.save()
          return true
        } else {
          return false
        }
      })
    },
    // 打开文档新建面板
    openAddResModal () {
      this.resDataModalMode = 'add'
      this.modifyResModel = {
        f_file_name: undefined
      }
      this.resDataModalVisible = true
    },
    // 新建文档
    addRes () {
      this.$emit('add', {})
      // const params = Object.assign({
      //   isAddForce: true
      // }, this.logicExtraParams)
      // this.reload(params)
    },
    // 重新加载
    reload (params) {
      runLogic('getFileInformation', params , this.serviceName).then(res => {
        this.resDataModalVisible = false
        this.assignBindObject = this.assignTemplates(this.bindObject, res.bindObject)
        this.useTemplateData()
      })
    },
    // 合并模板数据
    assignTemplates (newBindObject, templateData) {
      // 检查templates数组是否存在
      if (!templateData.templates || !Array.isArray(templateData.templates)) {
        console.warn('templateData.templates不存在或不是数组')
        return newBindObject
      }
      // 遍历templates数组中的每个属性名
      templateData.templates.forEach(propName => {
        // 检查templateData是否有该属性
        if (propName in templateData) {
          // 无论newBindObject是否有该属性，都进行赋值/添加
          newBindObject[propName] = templateData[propName]
        } else {
          console.warn(`templateData中不存在属性: ${propName}`)
        }
      })
      return newBindObject
    },
    useTemplateData () {
      // 确认是否有合并后的模板数据
      if (!this.assignBindObject) {
        this.$message.warning('没有可用的模板数据');
        return;
      }
      this.editorRef.setBindObject(this.assignBindObject)
      // console.log('resId', this.resId)
    },
    // 切换文档
    changeRes (value) {
      console.log('value', value)
      let params = {
        resId: value
      }
      if (value === -1) {
        params = {
          ...params,
          admissionId: this.admissionId,
          f_template_id: this.templateId
        }
        const that = this
        this.$confirm({
          title: '确认切换文档吗？',
          content: '您有尚未保存的文档，切换文档将丢失所有的修改',
          onOk () {
            that.reload(params)
            // that.userTemplateVisible = true
          },
          onCancel () {
            that.toggleResId = that.resId
          },
        })
      } else {
        const selectedItem = this.resListCp.find(item => item.value === value);
        console.log('selectedItem=================', selectedItem)
        if(selectedItem.templateId != this.templateId){
          runLogic('getFileInformation', selectedItem.params.params , this.serviceName).then(res => {
            this.init({
              modeType: this.modeType,
              fileUrl: res.url,
              resId: res.id,
              currResData: res.currResData,
              bindObject: res.bindObject,
              saveDataLogicName: params?.saveDataLogicName,
              serviceName: this.serviceName,
              logicExtraParams: params?.logicExtraParams,
              dropDownBoxParams: params?.dropDownBoxParams
            }, false)
          })
        }else{
          this.reload({resId: selectedItem.id})
        }
      }
    },
    // 保存文档
    save () {
      // 验证必须输入项
      if (this.editorRef.validate()) {
        // 获取HTML文档和结构化数据(JSON)
        console.log('save',this.editorRef.getBindObject())
        const data = {
          doc: this.editorRef.getHtml(),
          dataObject: {
            ...this.editorRef.getBindObject(),
            ...this.codeData // 合并 codeData 数据
          },
          dataMode: this.dataMode,
          resId: this.resId,
          modifyResModel: this.modifyResModel,
          logicExtraParams: this.logicExtraParams,
          is_template: this.isTemplate,
          f_file_name: this.fileName
        }
        // 保存HTML文档和结构化数据到后端服务
        const queryParams = {admissionId: this.admissionId, f_template_id: this.templateId}
        runLogic(this.saveDataLogicName, data, this.serviceName)
          .then(res => {
            this.$message.success('保存成功')
            this.reload({...queryParams,resId: res.currResData.id})
            this.$emit('saveafter', data.dataObject)
          })
          .catch(err => {
            const msg = (err && (err.message || err.msg || (err.data && err.data.message))) || String(err)
            console.error('[XHisEditor save] 病历保存失败', err)
            if (this.$message && this.$message.error) this.$message.error(msg || '病历保存失败')
          })
          .finally(() => {
            this.resDataModalVisible = false
            this.saveVisible = false
          })
      } else {
        this.$message.error('请检查未填写的项目')
      }
    },
    // 打印文档
    print () {
      this.editorRef.execCommand('print')
    },
    /**
     * 设置输入结束事件监听器
     * 监听键盘事件、输入事件，支持回车和数据录入后发送 inputEnd 事件
     * 处理防抖和中文输入法（拼音输入）的情况
     */
    setupInputEndListener () {
      if (!this.editorRef) {
        return
      }

      // 每次都重新设置监听器，确保在文书重新加载后仍然有效
      this.inputListenerSetup = true
      this.isComposing = false

      // 监听编辑器 iframe 内的键盘事件
      if (this.editorRef.document) {
        const doc = this.editorRef.document

        // 1. 监听回车键事件
        doc.addEventListener('keydown', (event) => {
          // 检查是否按下了回车键
          if (event.key === 'Enter' || event.keyCode === 13) {
            const currentField = this.getCurrentField()

            if (currentField && this.filterFields.includes(currentField)) {
              // 在配置字段内：阻止换行 + 触发事件
              event.preventDefault()

              if (this.fieldFilter && this.fieldFilter.trim()) {
                // 立即检查数据变化（回车键不需要防抖）
                setTimeout(() => {
                  this.checkDataChanges('enter-key')
                }, 50)
              }
            }
            // 不在配置字段内：允许正常换行（不阻止默认行为）
          }
        })

        // 2. 监听中文输入法开始（拼音输入开始）
        doc.addEventListener('compositionstart', () => {
          this.isComposing = true
          // 清除之前的防抖定时器，避免在输入拼音时触发
          clearTimeout(this.debounceTimer)
        })

        // 3. 监听中文输入法结束（拼音输入完成，确认输入）
        doc.addEventListener('compositionend', () => {
          this.isComposing = false
          // 拼音输入完成后，延迟触发检查（等待编辑器更新数据）
          if (this.fieldFilter && this.fieldFilter.trim()) {
            clearTimeout(this.debounceTimer)
            this.debounceTimer = setTimeout(() => {
              this.checkDataChanges('composition-end')
            }, 300)
          }
        })

        // 4. 监听 input 事件（数据录入）
        doc.addEventListener('input', () => {
          // 如果正在输入中文（拼音输入中），不触发事件
          if (this.isComposing) {
            return
          }

          // 检查当前字段是否在过滤列表中
          const currentField = this.getCurrentField()
          if (currentField && this.filterFields.includes(currentField)) {
            if (this.fieldFilter && this.fieldFilter.trim()) {
              // 防抖处理，避免频繁触发
              clearTimeout(this.debounceTimer)
              this.debounceTimer = setTimeout(() => {
                this.checkDataChanges('input')
              }, 500) // 数据录入使用稍长的防抖时间（500ms）
            }
          }
        })
      }

      // 5. 同时监听编辑器的 change 事件，作为补充（兼容性处理）
      if (this.editorRef.on) {
        this.editorRef.on('change', () => {
          // 如果正在输入中文，不触发
          if (this.isComposing) {
            return
          }

          if (this.fieldFilter && this.fieldFilter.trim()) {
            // 防抖处理，避免频繁触发
            clearTimeout(this.debounceTimer)
            this.debounceTimer = setTimeout(() => {
              this.checkDataChanges('editor-change')
            }, 300)
          }
        })
      }
    },
    /**
     * 检查字段内容并触发事件
     * @param {string} source - 触发源标识
     */
    checkDataChanges (source) {
      if (!this.editorRef || !this.fieldFilter) {
        return
      }

      try {
        const currentData = this.getEditorData()
        if (!currentData) return

        // 检查规定字段是否有实际内容（非空）
        let hasContent = false
        const filteredData = {}

        this.filterFields.forEach(fieldName => {
          const fieldValue = currentData[fieldName]
          if (fieldValue !== undefined && fieldValue !== null && fieldValue !== '') {
            filteredData[fieldName] = fieldValue
            hasContent = true
          }
        })

        // 只有当规定字段有实际内容时才触发事件
        if (hasContent) {
          this.$emit('inputEnd', {
            content: this.editorRef.getHtml ? this.editorRef.getHtml() : '',
            bindData: currentData,
            filteredData, // 只包含规定字段的数据
            filterFields: this.filterFields, // 规定的字段列表
            editor: this.editorRef,
            triggerSource: source
          })
        }
      } catch (e) {
        // 静默处理错误，避免影响编辑器正常功能
      }
    },

    // 获取当前光标所在的字段名
    getCurrentField () {
      try {
        if (this.editorRef && this.editorRef.control && this.editorRef.control.getFocusField) {
          const focusField = this.editorRef.control.getFocusField()

          // 处理对象类型的返回值
          if (focusField && typeof focusField === 'object') {
            // 方法1：尝试获取 name 属性
            if (focusField.name) {
              return focusField.name
            }

            // 方法2：如果是 DOM 元素，尝试获取 name 属性
            if (focusField.getAttribute) {
              const fieldName = focusField.getAttribute('name')
              if (fieldName) {
                return fieldName
              }
            }

            // 方法3：如果对象有 outerHTML，尝试从中提取 name
            if (focusField.outerHTML) {
              const nameMatch = focusField.outerHTML.match(/name=["']([^"']+)["']/)
              if (nameMatch && nameMatch[1]) {
                return nameMatch[1]
              }
            }

            // 方法4：如果对象有 innerHTML，尝试从中提取 name
            if (focusField.innerHTML) {
              const nameMatch = focusField.innerHTML.match(/name=["']([^"']+)["']/)
              if (nameMatch && nameMatch[1]) {
                return nameMatch[1]
              }
            }

            // 方法5：遍历对象属性，查找可能的name信息
            for (const key in focusField) {
              if (key.toLowerCase().includes('name') && focusField[key]) {
                if (typeof focusField[key] === 'string' && focusField[key].includes('chief_complaint')) {
                  return 'chief_complaint'
                }
              }
              if (key === 'id' && focusField[key]) {
                return focusField[key]
              }
            }
          }
        } else {
          console.log('editorRef.control.getFocusField不可用')
        }
      } catch (e) {
        console.log('getCurrentField中发生错误:', e)
        // 静默处理错误
      }
      return null
    },
    /**
     * 手动触发数据检查（用于测试）
     */
    testDataChanges () {
      if (this.fieldFilter && this.fieldFilter.trim()) {
        this.checkDataChanges('manual-test')
      }
    },

    close () {
      this.ready = false
    },
    // 刷新文档
    refresh () {
      this.loadFile(this.fileUrl, this.bindObject, this.currResData)
    },
    // 导出下拉菜单
    handleExportMenuClick (e) {
      const key = e.key
      this.editorRef.execCommand(key)
    },
    // 隐藏工具栏
    hideToolbar () {
      if (!this.hideEditorToolbar) return

      try {
        // 通过iframe访问文档
        const iframe = document.getElementById('x-editor')
        if (!iframe || !iframe.contentDocument) return

        const doc = iframe.contentDocument

        // 注入CSS样式隐藏工具栏并调整布局
        const style = doc.createElement('style')
        style.textContent = `
          #_toolbar { display: none !important; }
          #_tool-tab { display: none !important; }
          .tool-bar { display: none !important; }
          #_main {
            top: 0px !important;
            height: 100% !important;
          }
        `
        doc.head.appendChild(style)

      } catch (error) {
        // 静默失败
      }
    }
  }
}
</script>
<style scoped lang="less">
.editor-action-container {
  height: 40px;
}
.editor-action-button {
  .ant-btn-primary {
    background-color: rgb(0, 87, 254) !important;
  }
}
:deep(.ant-divider-horizontal) {
  margin: 4px 0;
}
/* 组合按钮容器 - 关键修正 */
.combined-save-btn {
  display: inline-flex;
  height: 32px;
}

/* 主保存按钮 - 保持原有样式 */
.save-btn-main {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-right: none !important;
  height: 32px;
  padding: 0 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: -1px; /* 关键：负边距消除间距 */
}

/* 下拉按钮 - 仅调整间距 */
.dropdown-trigger-btn {
  height: 32px !important;
  width: 24px !important;
  min-width: 24px !important;
  padding: 0 !important;
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-left: 1px solid rgba(255, 255, 255, 0.3) !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 0px;
}

/* 下拉图标保持原样 */
.dropdown-trigger-btn .anticon {
  font-size: 12px;
  margin: 0 !important;
}
.custom-radio-group {
  .ant-radio-button-wrapper-checked {
    background-color: rgb(0, 87, 254) !important;
  }
}

/* 隐藏工具栏的样式 - 当iframe不可访问时使用 */
:deep(#x-editor.hide-toolbar) {
  /* 当工具栏隐藏时，可以在这里调整iframe的样式 */
  margin-top: -50px; /* 向上移动以减少空白 */
}
</style>
