Skip to content

DDeiFile

  DDeiFile是代表一个设计文件,一个文件含有多个DDeiSheet(页签)。   DDeiFile实例包含了一个文件的所有数据,在获取后可以通过它访问其他内容。DDeiEditor中的files属性记录了当前打开的文件列表。

  一个DDeiEditor实例至少包含一个DDeiFile实例。

  本篇最后提供的示例可以在文档中直接预览。

属性

属性名说明数据类型静态默认值备注
id文件IDstring
unicode唯一编号string系统生成自动编码
name文件的名称,不包含扩展名string
desc文件的描述string[]
extData额外数据,存储额外的业务关键信息object
state状态DDeiFileStateNONE
active激活DDeiActiveTypeNONE
publish发布string00否/1是
lastUpdateTime最后修改时间number当前时间毫秒数字
path文件的完整路径string0包含了目录的路径
sheets页签集合DDeiSheet[]
currentSheetIndex当前所在页签number-1
histroy操作日志object[][]用于保存、撤销和恢复
modelNumber模型数量number0
modelType模型类型stringDDeiFile

方法

static loadFromJSON

  将JSON转换为一个DDeiFile实例

参数

参数名类型范围默认值备注
jsonobject文件JSON数据
tempDataobject用于初始化的数据:

返回值

类型备注
DDeiFileDDeiFile实例

toJSON

  将DDeiFile实例转换为JSON对象

参数

  无

返回值

类型备注
JSON包含了DDeiFile所有信息的JSON对象

calModelNumber

  计算并返回当前文件的模型总数量

参数

  无

返回值

类型备注
number模型总数量

changeSheet

  切换页签

参数

参数名类型范围默认值备注
indexnumber页签下标

返回值

  无

addHistroy

  记录操作日志

参数

参数名类型范围默认值备注
dataobject文件数据

返回值

  无

revokeHistroyData

  根据日志撤销数据到上一步操作

参数

  无

返回值

  无

searchModels

  根据属性搜索控件

参数

参数名类型范围默认值备注
keywordsstring搜索关键字
attrstring属性名称
isRegbooleanfalse是否正则表达式
areanumber1搜索范围1本页/2本文档/3所有打开文件
matchCasebooleanfalse区分大小写
matchAllbooleanfalse全字匹配

返回值

类型备注
Array搜索结果,包含了满足所有条件的控件以及位置列表

示例

代码

vue
<script setup lang="ts">
import DDeiEditorView from "ddei-editor";
import {DDeiEditor,DDeiFile,DDeiCoreStandLayout,DDeiAbstractShape} from "ddei-editor";
import { defineComponent, markRaw,getCurrentInstance,ref } from "vue";
//获取主对象实例,代替this获取$refs
const {proxy} = getCurrentInstance()

const jsontext = ref("无JSON")
const options = markRaw({
  config: { 
    "grid": 0, //网格线
    "background": { color: "blue", opacity: 0.1 }, //背景色
    initData: {
      controls: [
        {
          model: "102010",
          text: "初始化图形"
        },
      ]
    }
  },
  //配置扩展插件
  extensions: [
    //布局的配置
    DDeiCoreStandLayout.configuration({
      //配置插件
      'top': [],
      'middle': ['ddei-core-panel-canvasview'],
      'bottom': [],
      'left': [],
      'right': []
    }),
  ],
})

const getData = () => {
  //获取编辑器 
  let editor = proxy.$refs["ddei_editor_api_2"].editor;
  //获取JSON
  let file:DDeiFile = editor.files[0]
  jsontext.value = JSON.stringify(file.toJSON());
};

</script>

<template>

<button @click="getData" style="border:1px solid grey;margin-left:5px;padding:5px">获取JSON</button>

<div style="width:400px;height:400px;margin:100px auto;">
  <DDeiEditorView :options="options" ref="ddei_editor_api_2" id="ddei_editor_api_2"></DDeiEditorView>
</div>
</template>

效果预览

## 技术支持
QQ:3697355039
微信公众号:ddei757