应用窗口开发文档

一、添加命名视图

快速搜索

注册应用弹窗路由

添加路由

    components: {
      default: Main,
      // ai（视图名称）: AIAssistant（组件）
      ai: AIAssistant
    },

文件路径

vite\packages\table\route\main.ts

二、添加应用配置

快速搜索

应用弹窗运行列表

应用配置

属性名	是否必填	类型	说明	默认值
name	是	string	对应前面填写的视图名称
cname	是	string	应用中文名称
icon	是	string	应用图标，推荐优先从/img/appLogo/xxxx
iconType		string	同mix-icon参数	select
visible		string	是否显示应用	false
width		string	弹窗宽度，需要写px	1000px
height		string	弹窗高度，需要写px	572px
openMode		boolean	default为路由打开方式，modal为弹窗	modal
isMaximize		boolean	是否最大化	false
isFullScreen		boolean	是否全屏	false

文件路径

vite\packages\table\apps\appModal\src\config\data.ts

三、使用应用弹窗

文件路径

vite\packages\table\hooks

修改打开方式

useAppModal('name') name为必传参数 否者无法找到配置

import { useAppModal } from '../hooks' // 自行根据实际路径导入


const {
  openApp
} = useAppModal('ai') // 指视图名

openApp()

hook说明

属性名	类型	说明	是否有参数
AppOpenMode	Component	样式组件，实现切换打开方式配置项，实际样式参考ai助手
initApp	Function	初始化函数 将新增应用配置同步，在全局已经调用，开发同学不需要关注和调用。（项目初始化会更新一次配置，重置除了状态的所有属性）
openApp	Function	会根据配置通过弹窗或路由打开	有
switchVisible	Function	手动切换应用打开状态	有

具体参数

函数名	参数1	参数1说明
openApp	object	路由模式以router.push(params)传入，弹窗模式以inject传入
switchVisible	boolean	默认取反，可手动指定

inject注入

	说明
modalStatus	用于判断差异
modalParams	参数传递

四、其他

布局样式推荐

确保样式是以flex布局搭建

最外层

视图组件最外层 确保全部通过一个div包裹住

 <div class="w-full h-full flex">
 </div>

内部

确保基于flex-1获取最大高度，即可完成适配