排版布局设计

最后更新于:2022-04-02 07:24:17

# APP首页排版设计 >[info] version`2.5+` 20210801 自定义配置移动端首页;支持首页菜单、登录页面、封面图、online表单、设计器表单以及APP相关的基础信息(***注意:修改后配置想要立即生效需要APP端退出重新登录才能实现。默认配置信息缓存十分钟***。) [TOC] ## 1.APP基础配置 > 登录页面、logo图、轮播图 * 登录后台,点击`表单设计 > APP智能设计`,可以看到如下图页面 ![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/61/d3/61d32aeb780a0a4fee8fcf0bfb2528da_1687x814.png) * 在配置信息的tab下面,可以设置app的标题、logo和首页的轮播图信息。配置完成后的app页面,如下 ![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/00/8d/008db5b123d6f8be33f239b8c627a876_1215x611.png) * **配置方式:** 填写完成标题等信息后,点击下方保存按钮即可; ## 2.首页菜单配置 > 首页菜单图标、路由、online表单、设计器表单 ### 2.1字段介绍 见下图: ![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/aa/81/aa813ab92a7df08dea6d595ac0a155b3_1714x756.png) ### 2.2新增 点击图中的+号,右侧会切换到菜单配置tab,输入基本信息后,点击保存即可新增。 ![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/49/d1/49d10a2dc5acc2e6f6951dae14747838_1690x809.png) >[info]具体路由配置参见下方【2.5路由配置】 ### 2.3路由配置 **方式一:手动输入路由名称。具体路由名称的获取方式如下:** APP端配置路由: 1:在page.json文件中配置好页面路径 ![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/76/26/76268ace389f3fe6583a0925f3f2cee6_1392x928.png) 2: 在router下的routes文件下配置路由地址和名称 ![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/a0/33/a033a46fb36a887ceb3652a68fb0fdb2_1701x675.png) 3: 将路由name配置到下图位置即可 ![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/13/65/1365e9885d7c06efaadce0874fd45a1b_1693x765.png) **方式二:点击输入栏内后侧的![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/49/33/4933379a3aaba106638a6a794dae92ad_39x37.png)操作按钮,弹出选择框,选择你要的表单即可** ![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/0d/72/0d724d86963fed37f19f074e35aa94f9_1538x674.gif) Tab1对应的是你创建的online表单 Tab2对应的是你创建的设计器表单 >[info]注意点: online对接的路由配置格式:**/app/online/表名** 表单设计器对接的路由配置格式:**/app/desform/表单编码** 普通的路由配置的格式: ***APP端设置的路由名称*** ### 2.4是否开启 新增模块的状态默认是开启的,若果关闭后,左侧的菜单模块会置灰,在app端的页面上则不会显示该模块 ![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/b7/71/b7718c77dfc7433d4c65c7efcd8bef77_1538x674.gif) ### 2.5拖拽排版 拖动具体的服务模块,可以将它放到任意位置,来修改排版和布局,拖动完成后,点击下方**保存排版**按钮即可 **切记:拖拽排序完后一定要点击保存排版按钮** ![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/c7/e8/c7e8b8def8056e98c94de444b9be83e8_617x744.gif) ## 3.首页布局如何切换 通过设置根目录下App.vue 页面配置的参数 isLocalConfig 默认为true,表示通过前端配置的数据来构建首页。 改为false,通过后台智能设计的数据来加载首页。 ![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/32/dd/32dd53ce51b9d355b1788540d169c64a_1350x322.png)
';