3.0 KiB
		
	
	
	
			
		
		
	
	
			3.0 KiB
		
	
	
	
项目说明
- 本项目为天津VMI库使用的手持程序包
 
平台简介
- 应用框架基于uniapp,支持小程序、H5、Android和IOS。
 - 前端组件采用uni-ui,全端兼容的高性能UI框架。
 - 与 WMS后端完成完成权限管理会框架的整合,前端代码与WMS前端代码基本保持一致。
 
主要代码简介
系统配置
- 基础登录链接信息配置(访问后端的IP信息),位于根目录下的 config.js 文件中的 baseUrl;
 - logo 替换 位于根目录下的 config.js 文件中的 appInfo.logo;
 - 实际项目启动时现场IP设置,查看登录页面下小字 "IP端口设置";
 - 程序运行时启动的端口设置 manifest.json中
 
页面功能的开发
- 1.组件的使用,可参考文档 ColorUI 使用文档;
 - 2.调用后端方法 ,参见 api/wms/login.js 使用、配置方式与WMS主服务的前端框架保持一致;
 - 3.简便弹窗的使用:参见util/common.js 中 showConfirm方法;
 
实践:完成以下三个步骤,可完成页面添加和展示
- 1.新增界面 归类到 page/work/wms 文件夹中;
 - 2.新增页面配置路由:添加到根目录下 page.json文件中;
 - 3.功能也功能菜单加载:版本1.在 static/json/dynamicRouter.json 文件中添加能够访问的路由信息;(在后续版本中会修改为系统根据所分配的权限去后端获取权限菜单)
 
界面菜单的权限管理
# 基本原理
- 基本原理与WMS的PC端主界面相同,在登录成功后,
 - 1.在utils/request.js文件中添加自定义heander信息,标明访问终端类型;
 - 2.加载routes(当前登录用户权限下可访问的所有页面路由定向),在“pages/work/index”界面中渲染界面路由;
 - 3.加载powers(当前用户权限下所有页面允许访问的按钮标识),在打开具体界面时,会在缓存中判断是否存在该code对应的信息,界面渲染时时决定是否展示对应按钮;
 - 注意:目前只有pages/work/index 界面中的进行权限相关内容控制,其余未添加;
 - 当前版本中,因为只针对与主页做菜单,所以并未支持
 
config.header['platform'] = 'APP'
- 按钮的权限控制:components 添加了 has-authority组件,用于按钮的权限校验;
 - 使用是参照 页面pages/work/wms/palletInfoQuery.vue
 
<uni-td>
	<view class="grid  text-center solid-bottom  justify-start">
	//has-authority 标签,其中code与后端配置的按钮 名称相同
		<has-authority :code="'pallet:infoQuery:btn'">
			<view class=" margin-xs radius">
				<button class="uni-button" size="mini" type="primary"
					@click="btnModify">修改</button>
			</view>
		</has-authority>
		<has-authority :code="'pallet:infoQuery:btnAA'">
			<view class=" margin-xs radius">
				<button class="uni-button" size="mini" type="warn">删除</button>
			</view>
		</has-authority>
	</view>
</uni-td>