el-dialog可拖拽可编辑页面内容

<script>
import {complete, rejectTask, returnList, returnTask, taskReturnCreateUser} from "@/api/workflow/task";
import {detailProcess} from "@/api/workflow/process";
import {getBillAuditInfo} from "@/api/bbc/api";

export default {
  name: "AuditElementDialog",
  props: {
    visible: {
      type: Boolean,
      default: false
    },
    companyId: {
      type: Number,
      default: null
    },
    businessName: {
      type: String,
      default: ''
    },
    missingExplain: {
      type: String,
      default: ''
    },
    formKey: {
      type: String,
      default: ''
    },
  },
  data() {
    return {
      dialogTop: '50px',
      localMissingExplain: this.missingExplain, // 本地副本
      localBusinessName: this.businessName,
      dialogLeft: '50px',
      innerVisible: this.visible,
      loading: false,
      dialogTitle: this.title,
      data: {},
    };
  },
  created() {
    this.initData();
  },
  watch: {
    visible(val) {
      this.innerVisible = val;
      if (val) this.initData();
    },
    innerVisible(val) {
      this.$emit('update:visible', val);
    },
    missingExplain(newVal) {
      this.localMissingExplain = newVal // 父组件更新时同步
    },
    localMissingExplain(newVal) {
      this.$emit('update:missingExplain', newVal) // 本地变化同步给父组件
    },
    businessName(newVal) {
      this.localMissingExplain = newVal // 父组件更新时同步
    },
    localBusinessName(newVal) {
      this.$emit('update:businessName', newVal) // 本地变化同步给父组件
    }
  },
  methods: {
    initData() {
      const companyId = this.companyId || this.$route?.query?.companyId;
      const formKey = this.formKey || this.$route?.query?.formKey;
      if (companyId && formKey) {
        let params = {
          formKey: formKey,
          companyId: companyId
        }
        getBillAuditInfo(params).then(res => {
          this.data = res.data;
        });
      }
    },
  }
}
</script>

<template>
  <div>
    <el-dialog
      :visible.sync="innerVisible"
      width="500px"
      v-dialogDrag
      :modal="false"
      :close-on-click-modal="false"
      :append-to-body="false"
      class="audit_dialog"
      ref="dialog"
      :destroy-on-close="false">
      <el-descriptions class="margin-top" title="审核要素" :column="1" :size="'small'" border="">
        <el-descriptions-item>
          <template slot="label">
            公司名称
          </template>
          {{ data.companyName || '无' }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            表单名称
          </template>
          {{ data.formName || '无' }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            业务类型
          </template>
          {{ localBusinessName || '无' }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            附件要求
          </template>
          {{ data.attachmentRequirement || '无' }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            审核要素
          </template>
          <div style="height: 300px">
            <div v-html="data.auditContent || '无'"></div>
          </div>
        </el-descriptions-item>
        <el-descriptions-item class="'input-miss'">
          <template slot="label">
            缺失附件说明
          </template>
          <el-input v-model="localMissingExplain"
                    placeholder="如有缺失要素条件请在下面说明，如理由不充分则审核不给予通过。" type="textarea"></el-input>
        </el-descriptions-item>
      </el-descriptions>
    </el-dialog>

  </div>
</template>

<style scoped lang="scss">
::v-deep .el-descriptions .is-bordered .el-descriptions-item__cell {
  border: 1px solid #000000;
}

::v-deep .el-descriptions-item__label.is-bordered-label {
  width: 150px;
}

::v-deep .el-dialog__wrapper {
  pointer-events: none;
}

::v-deep .el-dialog {
  pointer-events: auto;
}
</style>

代码主要是

配置
      v-dialogDrag
      :modal="false"
      :close-on-click-modal="false"
      :append-to-body="false"
css代码
::v-deep .el-dialog__wrapper {
  pointer-events: none;
}

::v-deep .el-dialog {
  pointer-events: auto;
}