cbjsxt-front-master/src/views/costAudit/auditInfo/auditManage/workDraft.vue

<template>
  <div class="work-draft-container">
    <div class="editor-header">
      <span class="editor-title">工作底稿在线编辑：</span>
      <el-button type="primary" size="small" @click="handleOnlineEdit">
        保存
      </el-button>
    </div>
    <div class="editor-wrapper">
      <ht-editor
        v-model="workingPaperContent"
        class="working-paper-editor"
        height="500px"
        width="100%"
        :config="editorConfig"
        @ready="onEditorReady"
      />
    </div>
    <!-- 工作底稿列表 -->
    <div>
      <el-button type="primary" size="small" @click="handleAddWorkingPaper">
        核增核减记录
      </el-button>
    </div>
    <el-table
      v-loading="loading"
      :data="workingPaperRecords"
      style="width: 100%; margin-top: 20px"
      border
    >
      <!-- <el-table-column type="selection" width="55"></el-table-column> -->
      <el-table-column
        prop="id"
        label="序号"
        width="80 "
        header-align="center"
        align="center"
      >
        <template slot-scope="scope">
          {{ scope.$index + 1 }}
        </template>
      </el-table-column>
      <el-table-column
        prop="auditSubject"
        label="核增核减科目"
        width="180"
        header-align="center"
        align="left"
      ></el-table-column>
      <el-table-column
        prop="basicInfo"
        label="基本情况"
        width="200"
        header-align="center"
        align="left"
      ></el-table-column>
      <el-table-column
        prop="auditDesc"
        label="核增核减说明"
        header-align="center"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="auditTime"
        label="时间"
        width="180"
        header-align="center"
        align="center"
      ></el-table-column>
      <el-table-column
        label="附件"
        width="120"
        header-align="center"
        align="center"
      >
        <template slot-scope="scope">
          <el-button
            v-if="scope.row.attachmentUrl"
            type="text"
            size="small"
            icon="iconfont-5039297 icon-wenjian"
            @click="handlePreviewWorkingPaperAttachment(scope.row)"
          >
            查看
          </el-button>
        </template>
      </el-table-column>
      <el-table-column
        label="操作"
        width="150"
        header-align="center"
        align="center"
      >
        <template slot-scope="scope">
          <el-button
            type="text"
            size="small"
            @click="handleEditWorkingPaper(scope.row)"
          >
            修改
          </el-button>
          <el-button
            type="text"
            size="small"
            @click="handleDeleteWorkingPaper(scope.row)"
          >
            删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>

    <!-- 工作底稿编辑弹窗 -->
    <el-dialog
      :title="workingPaperDialogTitle"
      :visible.sync="workingPaperDialogVisible"
      width="70%"
      :modal="false"
      append-to-body
    >
      <el-form
        ref="workingPaperForm"
        :model="workingPaperForm"
        :rules="workingPaperRules"
        label-width="120px"
      >
        <el-form-item label="被审核科目" prop="subject">
          <el-input
            v-model="workingPaperForm.subject"
            placeholder="请输入被审核科目"
            maxlength="30"
            show-word-limit
          />
        </el-form-item>
        <el-form-item label="基本情况" prop="basicSituation">
          <el-input
            v-model="workingPaperForm.basicSituation"
            type="textarea"
            :rows="4"
            maxlength="500"
            show-word-limit
            placeholder="请输入基本情况"
          />
        </el-form-item>
        <el-form-item label="核增核减说明" prop="description">
          <el-input
            v-model="workingPaperForm.description"
            type="textarea"
            :rows="4"
            maxlength="500"
            show-word-limit
            placeholder="请输入核增核减说明"
          />
        </el-form-item>
        <el-form-item label="日期">
          <el-date-picker
            v-model="workingPaperForm.auditDate"
            type="date"
            placeholder="选择日期"
            style="width: 100%"
          />
        </el-form-item>
        <el-form-item label="时间范围">
          <div style="display: flex; gap: 10px">
            <el-time-picker
              v-model="workingPaperForm.startTime"
              format="HH:mm"
              placeholder="开始时间"
              style="flex: 1"
              @change="handleStartTimeChange"
            />
            <span>-</span>
            <el-time-picker
              v-model="workingPaperForm.endTime"
              format="HH:mm"
              placeholder="结束时间"
              style="flex: 1"
              :picker-options="endTimePickerOptions"
            />
          </div>
        </el-form-item>
        <el-form-item label="上传附件" prop="fileList">
          <el-upload
            class="upload-demo"
            :action="''"
            :http-request="handleFileUpload"
            :on-remove="handleFileRemove"
            :before-upload="beforeFileUpload"
            :on-success="handleFileUploadSuccess"
            :on-error="handleFileUploadError"
            :on-progress="handleFileUploadProgress"
            :file-list="workingPaperForm.fileList"
            :limit="1"
            :on-exceed="handleFileExceed"
          >
            <el-tooltip
              v-show="
                !workingPaperForm.fileList ||
                workingPaperForm.fileList.length === 0
              "
              effect="dark"
              placement="top"
              :open-delay="200"
              content="支持 pdf/doc/docx/xls/xlsx/csv，单个文件≤50MB，最多1个"
            >
              <el-button size="small" type="primary">选择文件</el-button>
            </el-tooltip>
          </el-upload>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="handleWorkingPaperSubmit">
          确定
        </el-button>
        <el-button @click="workingPaperDialogVisible = false">关闭</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import {
    getTaskDraftList,
    addTaskDraft,
    deleteTaskDraft,
    getTaskDraftOnlineEdit,
    saveTaskDraftOnlineEdit,
  } from '@/api/audit/taskDraft'
  import { uploadFile } from '@/api/file'
  export default {
    name: 'WorkDraft',
    props: {
      id: {
        type: [String, Number],
        default: null,
      },
    },
    data() {
      return {
        loading: false,
        editorConfig: {
          // 可以在这里覆盖全局配置的选项
          height: '300px',
          placeholder: '请输入内容...',
          excludeMenus: ['image', 'video'],
        },
        // 工作底稿数据
        workingPaperContent: '',
        // 工作底稿记录列表
        workingPaperRecords: [],
        // 工作底稿弹窗
        workingPaperDialogVisible: false,
        workingPaperDialogTitle: '添加工作底稿',
        isEditWorkingPaper: false,
        workingPaperForm: {
          id: '',
          subject: '',
          basicSituation: '',
          description: '',
          auditDate: '',
          startTime: '',
          endTime: '',
          attachments: [],
          fileList: [],
          attachmentUrl: '',
        },
        workingPaperRules: {
          subject: [
            { required: true, message: '请输入被审核科目', trigger: 'blur' },
          ],
          basicSituation: [
            { required: true, message: '请输入基本情况', trigger: 'blur' },
          ],
          description: [
            { required: true, message: '请输入核增核减说明', trigger: 'blur' },
          ],
        },
      }
    },
    computed: {
      // 结束时间选择器的配置，限制结束时间不能小于开始时间
      endTimePickerOptions() {
        return {
          selectableRange: this.getEndTimeSelectableRange(),
        }
      },
    },
    watch: {
      id: {
        handler(newVal) {
          if (newVal) {
            this.getWorkingPaperRecords()
            this.getWorkingPaperContent()
          }
        },
        immediate: true,
      },
    },
    mounted() {
      if (this.id) {
        this.getWorkingPaperRecords()
        this.getWorkingPaperContent()
      }
    },
    methods: {
      // 获取结束时间可选择的范围
      getEndTimeSelectableRange() {
        if (!this.workingPaperForm.startTime) {
          // 如果没有开始时间，可以选择所有时间
          return '00:00:00 - 23:59:59'
        }
        // 获取开始时间的小时和分钟
        let startHour = 0
        let startMinute = 0
        if (this.workingPaperForm.startTime instanceof Date) {
          startHour = this.workingPaperForm.startTime.getHours()
          startMinute = this.workingPaperForm.startTime.getMinutes()
        } else if (typeof this.workingPaperForm.startTime === 'string') {
          const parts = this.workingPaperForm.startTime.split(':')
          if (parts.length >= 2) {
            startHour = parseInt(parts[0]) || 0
            startMinute = parseInt(parts[1]) || 0
          }
        }
        // 开始时间加1分钟，作为最小可选时间
        let minHour = startHour
        let minMinute = startMinute + 1
        if (minMinute >= 60) {
          minMinute = 0
          minHour += 1
        }
        if (minHour >= 24) {
          minHour = 23
          minMinute = 59
        }
        // 格式化为 HH:mm:ss 格式
        const minTime = `${String(minHour).padStart(2, '0')}:${String(
          minMinute
        ).padStart(2, '0')}:00`
        return `${minTime} - 23:59:59`
      },
      // 开始时间变化时的处理
      handleStartTimeChange() {
        // 如果结束时间存在且小于开始时间，则清空结束时间或提示
        if (this.workingPaperForm.endTime && this.workingPaperForm.startTime) {
          const startTime = this.getTimeMinutes(this.workingPaperForm.startTime)
          const endTime = this.getTimeMinutes(this.workingPaperForm.endTime)
          if (endTime <= startTime) {
            this.$message.warning('结束时间不能小于或等于开始时间，请重新选择')
            this.workingPaperForm.endTime = null
          }
        }
      },
      // 获取时间的总分钟数（用于比较）
      getTimeMinutes(time) {
        if (!time) return 0
        let hours = 0
        let minutes = 0
        if (time instanceof Date) {
          hours = time.getHours()
          minutes = time.getMinutes()
        } else if (typeof time === 'string') {
          const parts = time.split(':')
          if (parts.length >= 2) {
            hours = parseInt(parts[0]) || 0
            minutes = parseInt(parts[1]) || 0
          }
        }
        return hours * 60 + minutes
      },
      // 获取工作底稿列表
      async getWorkingPaperRecords() {
        if (!this.id) {
          return
        }
        try {
          this.loading = true
          const res = await getTaskDraftList({ taskId: this.id })
          if (res && res.value) {
            // 处理数据，格式化时间显示
            this.workingPaperRecords = (res.value || []).map((item) => {
              // 格式化时间显示，如果后端返回的是 time 字段，直接使用
              let auditTime = ''
              if (item.time) {
                auditTime = item.time
              } else if (item.auditTime) {
                auditTime = item.auditTime
              } else if (item.auditDate) {
                const date = new Date(item.auditDate)
                const formattedDate = `${date.getFullYear()}-${String(
                  date.getMonth() + 1
                ).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`
                const startTime = item.startTime || '00:00'
                const endTime = item.endTime || '23:59'
                auditTime = `${formattedDate} ${startTime}-${endTime}`
              }
              // 字段名映射
              return {
                ...item,
                auditSubject: item.subject || item.auditSubject,
                basicInfo: item.basicSituation || item.basicInfo,
                auditDesc: item.description || item.auditDesc,
                auditTime: auditTime,
              }
            })
          } else {
            this.workingPaperRecords = []
          }
        } catch (error) {
          // this.$message.error('获取工作底稿列表失败')
          console.error('获取工作底稿列表失败:', error)
          this.workingPaperRecords = []
        } finally {
          this.loading = false
        }
      },
      onEditorReady(editor) {
        // 编辑器初始化完成后的回调
        console.log('编辑器已就绪', editor)
        // 可以在这里获取编辑器实例，进行更多操作
      },
      // 获取工作底稿在线编辑内容
      async getWorkingPaperContent() {
        if (!this.id) {
          return
        }
        try {
          const res = await getTaskDraftOnlineEdit({ taskId: this.id })
          if (res && res.code === 200 && res.value) {
            // 回显内容到编辑器
            this.workingPaperContent = res.value.content || ''
          } else {
            // 如果没有数据，初始化为空
            this.workingPaperContent = ''
          }
        } catch (error) {
          console.error('获取工作底稿在线编辑内容失败:', error)
          this.workingPaperContent = ''
        }
      },
      // 保存工作底稿在线编辑内容
      async handleOnlineEdit() {
        if (!this.id) {
          this.$message.warning('缺少任务ID')
          return
        }
        try {
          // 获取当前时间，格式化为 yyyy-MM-dd HH:mm:ss
          const now = new Date()
          const year = now.getFullYear()
          const month = String(now.getMonth() + 1).padStart(2, '0')
          const day = String(now.getDate()).padStart(2, '0')
          const hours = String(now.getHours()).padStart(2, '0')
          const minutes = String(now.getMinutes()).padStart(2, '0')
          const seconds = String(now.getSeconds()).padStart(2, '0')
          const updateTime = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`

          const params = {
            taskId: this.id,
            content: this.workingPaperContent || '',
            updateTime: updateTime,
          }

          const res = await saveTaskDraftOnlineEdit(params)
          if (res && res.code === 200) {
            this.$message.success(res.message || '保存成功')
          } else {
            this.$message.error(res.message || '保存失败')
          }
        } catch (error) {
          console.error('保存工作底稿在线编辑内容失败:', error)
          // this.$message.error('保存失败')
        }
      },
      // 工作底稿操作
      handleAddWorkingPaper() {
        this.isEditWorkingPaper = false
        this.workingPaperDialogTitle = '添加工作底稿'
        this.workingPaperForm = {
          id: '',
          subject: '',
          basicSituation: '',
          description: '',
          auditDate: new Date(),
          startTime: '',
          endTime: '',
          attachments: [],
          fileList: [],
          attachmentUrl: '',
        }
        // 重置表单验证状态
        if (this.$refs.workingPaperForm) {
          this.$refs.workingPaperForm.resetFields()
        }
        this.workingPaperDialogVisible = true
      },

      handleEditWorkingPaper(row) {
        this.isEditWorkingPaper = true
        this.workingPaperDialogTitle = '修改工作底稿'
        // 解析时间字符串
        let auditDate = new Date()
        let startTime = null
        let endTime = null

        // 优先使用 time 字段，如果没有则使用 auditTime，再没有则使用分开的日期时间
        const timeStr = row.time || row.auditTime || ''
        if (timeStr) {
          const timeParts = timeStr.split(' ')
          if (timeParts.length >= 2) {
            const date = timeParts[0]
            const timeRange = timeParts[1].split('-')
            auditDate = new Date(date)
            // 将时间字符串转换为 Date 对象
            if (timeRange[0]) {
              const [hours, minutes] = timeRange[0].split(':')
              startTime = new Date()
              startTime.setHours(
                parseInt(hours) || 0,
                parseInt(minutes) || 0,
                0,
                0
              )
            }
            if (timeRange[1]) {
              const [hours, minutes] = timeRange[1].split(':')
              endTime = new Date()
              endTime.setHours(
                parseInt(hours) || 0,
                parseInt(minutes) || 0,
                0,
                0
              )
            }
          }
        } else if (row.auditDate) {
          auditDate = new Date(row.auditDate)
          // 将时间字符串转换为 Date 对象
          if (row.startTime) {
            const [hours, minutes] = row.startTime.split(':')
            startTime = new Date()
            startTime.setHours(
              parseInt(hours) || 0,
              parseInt(minutes) || 0,
              0,
              0
            )
          }
          if (row.endTime) {
            const [hours, minutes] = row.endTime.split(':')
            endTime = new Date()
            endTime.setHours(parseInt(hours) || 0, parseInt(minutes) || 0, 0, 0)
          }
        }

        // 处理文件列表
        let fileList = []
        if (row.attachmentUrl) {
          fileList = [
            {
              name: row.fileName || '附件',
              url: row.attachmentUrl,
              response: { savePath: row.attachmentUrl },
            },
          ]
        }

        // 字段名映射
        this.workingPaperForm = {
          ...row,
          subject: row.subject || row.auditSubject || '',
          basicSituation: row.basicSituation || row.basicInfo || '',
          description: row.description || row.auditDesc || '',
          auditDate: auditDate,
          startTime: startTime,
          endTime: endTime,
          fileList: fileList,
          attachmentUrl: row.attachmentUrl || '',
        }
        this.workingPaperDialogVisible = true
      },

      async handleDeleteWorkingPaper(row) {
        try {
          await this.$confirm('确定要删除这条工作底稿吗？', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
          })

          const res = await deleteTaskDraft({ id: row.id })
          if (res.code === 200) {
            this.$message.success('工作底稿已删除')
            // 重新获取列表
            this.getWorkingPaperRecords()
          } else {
            this.$message.error(res.message || '删除失败')
          }
        } catch (error) {
          if (error !== 'cancel') {
            // this.$message.error('删除失败')
            console.error('删除工作底稿失败:', error)
          }
        }
      },

      async handleWorkingPaperSubmit() {
        try {
          await this.$refs.workingPaperForm.validate()

          // 验证时间范围
          if (
            this.workingPaperForm.startTime &&
            this.workingPaperForm.endTime
          ) {
            const startMinutes = this.getTimeMinutes(
              this.workingPaperForm.startTime
            )
            const endMinutes = this.getTimeMinutes(
              this.workingPaperForm.endTime
            )
            if (endMinutes <= startMinutes) {
              this.$message.error('结束时间不能小于或等于开始时间')
              return
            }
          }

          // 格式化日期
          const auditDate = new Date(this.workingPaperForm.auditDate)
          const formattedDate = `${auditDate.getFullYear()}-${String(
            auditDate.getMonth() + 1
          ).padStart(2, '0')}-${String(auditDate.getDate()).padStart(2, '0')}`

          // 格式化时间（如果没有选择时间，使用默认值）
          const startTime = this.workingPaperForm.startTime
            ? this.formatTime(this.workingPaperForm.startTime)
            : '00:00'
          const endTime = this.workingPaperForm.endTime
            ? this.formatTime(this.workingPaperForm.endTime)
            : '23:59'

          // 合并日期和时间范围为 time 字段
          const time = `${formattedDate} ${startTime}-${endTime}`

          // 构造提交数据
          const formData = {
            taskId: this.id,
            subject: this.workingPaperForm.subject,
            basicSituation: this.workingPaperForm.basicSituation,
            description: this.workingPaperForm.description,
            time: time,
            attachmentUrl: this.workingPaperForm.attachmentUrl,
          }

          // 如果是编辑模式，添加 id
          if (this.isEditWorkingPaper && this.workingPaperForm.id) {
            formData.id = this.workingPaperForm.id
          }

          const res = await addTaskDraft(formData)
          if (res.code === 200) {
            this.$message.success(
              this.isEditWorkingPaper ? '工作底稿修改成功' : '工作底稿添加成功'
            )
            this.workingPaperDialogVisible = false
            // 重新获取列表
            this.getWorkingPaperRecords()
          } else {
            this.$message.error(
              res.message || (this.isEditWorkingPaper ? '修改失败' : '添加失败')
            )
          }
        } catch (error) {
          if (error !== 'cancel') {
            // this.$message.error(
            //   this.isEditWorkingPaper ? '修改失败' : '添加失败'
            // )
            console.error('提交工作底稿失败:', error)
          }
        }
      },

      // 格式化时间为 HH:mm 格式
      formatTime(time) {
        if (!time) return ''
        if (typeof time === 'string') {
          // 如果已经是字符串格式 HH:mm，直接返回
          if (/^\d{2}:\d{2}$/.test(time)) {
            return time
          }
        }
        // 如果是 Date 对象
        if (time instanceof Date) {
          const hours = String(time.getHours()).padStart(2, '0')
          const minutes = String(time.getMinutes()).padStart(2, '0')
          return `${hours}:${minutes}`
        }
        return ''
      },

      handlePreviewWorkingPaperAttachment(row) {
        if (!row || !row.attachmentUrl) {
          this.$message.warning('该记录没有附件')
          return
        }

        // 获取附件URL，如果是逗号分隔的字符串，取第一个
        let attachmentUrl = ''
        if (typeof row.attachmentUrl === 'string') {
          attachmentUrl = row.attachmentUrl.split(',')[0].trim()
        } else if (Array.isArray(row.attachmentUrl)) {
          attachmentUrl = row.attachmentUrl[0]
        } else {
          attachmentUrl = row.attachmentUrl
        }

        if (!attachmentUrl) {
          this.$message.warning('该记录没有附件')
          return
        }

        try {
          // 处理文件URL
          let _fileUrl = ''
          if (attachmentUrl.startsWith('http')) {
            _fileUrl = attachmentUrl
          } else {
            _fileUrl = (window.context && window.context.form) + attachmentUrl
          }

          // 对文件URL进行Base64编码
          const encodedUrl = encodeURIComponent(Base64.encode(_fileUrl))

          // 构建 kkFileView 预览URL
          window.open(`${host}:8012/onlinePreview?url=${encodedUrl}`)
        } catch (e) {
          console.error('文件预览失败: ', e)
          this.$message.error('文件预览失败')
        }
      },

      // 文件上传前验证
      beforeFileUpload(file) {
        const allowedTypes = [
          'application/pdf',
          'application/msword',
          'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
          'application/vnd.ms-excel',
          'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
          'text/csv',
        ]

        const allowedExtensions = [
          '.pdf',
          '.doc',
          '.docx',
          '.xls',
          '.xlsx',
          '.csv',
        ]
        const fileExtension = '.' + file.name.split('.').pop().toLowerCase()

        // 检查文件格式
        const isCorrectType = allowedTypes.includes(file.type)
        const isCorrectExtension = allowedExtensions.includes(fileExtension)

        if (!isCorrectType && !isCorrectExtension) {
          this.$message.error(
            '只允许上传 pdf, doc, docx, xls, xlsx, csv 格式的文件！'
          )
          return false
        }

        // 检查文件大小 (50MB)
        const isLt50M = file.size / 1024 / 1024 < 50
        if (!isLt50M) {
          this.$message.error('文件大小不能超过 50MB!')
          return false
        }

        return true
      },

      // 自定义上传方法
      async handleFileUpload(options) {
        const { file, onProgress, onSuccess, onError } = options

        // 检查是否已经上传了文件
        if (
          this.workingPaperForm.fileList &&
          this.workingPaperForm.fileList.length >= 1
        ) {
          this.$message.warning('只能上传一个文件，请先删除已上传的文件')
          if (onError) {
            onError(new Error('只能上传一个文件'))
          }
          return
        }

        const formData = new FormData()
        formData.append('file', file)

        try {
          // 显示上传进度
          if (onProgress) {
            onProgress({ percent: 0 })
          }

          // 调用上传API
          const uploadRes = await uploadFile('/api/file/v1/upload', formData, {
            onUploadProgress: (progressEvent) => {
              // 计算上传进度
              if (progressEvent.total) {
                const percent = Math.round(
                  (progressEvent.loaded * 100) / progressEvent.total
                )
                if (onProgress) {
                  onProgress({ percent })
                }
              }
            },
          })

          // 检查上传结果
          if (uploadRes && uploadRes.code === 200 && uploadRes.value) {
            const fileInfo = uploadRes.value
            // 构造文件信息对象，符合element-ui upload组件的格式
            const fileObj = {
              uid: file.uid,
              name: file.name,
              status: 'success',
              size: file.size,
              response: fileInfo,
              url: fileInfo.savePath || fileInfo.url,
            }

            if (onSuccess) {
              onSuccess(fileInfo, fileObj)
              this.workingPaperForm.attachmentUrl =
                fileInfo.savePath || fileInfo.url
            }

            this.$message.success(`${file.name} 上传成功`)
          } else {
            throw new Error(uploadRes?.message || '上传失败，请稍后重试')
          }
        } catch (error) {
          console.error('文件上传失败:', error)
          // this.$message.error(`文件上传失败：${error.message || '未知错误'}`)
          if (onError) {
            onError(error)
          }
        }
      },

      // 上传成功回调
      handleFileUploadSuccess(response, file, fileList) {
        // 更新文件列表，添加文件URL信息
        this.workingPaperForm.fileList = fileList.map((item) => {
          if (item.uid === file.uid && response) {
            return {
              ...item,
              url: response.savePath || response.url || item.url,
              response: response,
            }
          }
          return item
        })
      },

      // 上传进度回调
      handleFileUploadProgress(event, file, fileList) {
        // element-ui 会自动处理上传进度显示
      },

      // 上传失败回调
      handleFileUploadError(err, file, fileList) {
        console.error('文件上传错误:', err)
        this.$message.error(`${file.name} 上传失败`)
        // 从文件列表中移除失败的文件
        this.workingPaperForm.fileList = fileList.filter(
          (item) => item.uid !== file.uid
        )
      },

      // 超出文件数量限制
      handleFileExceed(files, fileList) {
        this.$message.warning(
          `当前限制选择 1 个文件，本次选择了 ${files.length} 个文件，共选择了 ${fileList.length} 个文件`
        )
      },

      // 移除文件
      handleFileRemove(file, fileList) {
        this.workingPaperForm.fileList = fileList
        this.workingPaperForm.attachmentUrl = ''
        this.$message.info(`${file.name} 已移除`)
      },
    },
  }
</script>

<style scoped lang="scss">
  .work-draft-container {
    width: 100%;
  }

  .editor-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
  }

  .editor-title {
    font-size: 16px;
    font-weight: bold;
  }

  .editor-wrapper {
    width: 100%;
    margin-bottom: 20px;
  }

  .working-paper-editor {
    width: 100% !important;
  }

  :deep(.inputs.ht-form-inputs__inline) {
    width: 100%;
  }

  :deep(.ht-editor) {
    width: 100% !important;
  }

  :deep(.ht-container) {
    width: 100% !important;
  }

  .dialog-footer {
    text-align: right;
  }

  .dialog-footer .el-button {
    margin-left: 10px;
  }
</style>