前言
VueAdminWorkP版本也迎来了新年第一次升级。增加了几个好用的功能和组件。
同时，借此机会也向大家说两个好消息
VueAdminWorkP升级说明
新增：`VawVerifySimple`滑动验证组件，用于登录的时候进行简单的验证
在之前的登录页面中，只有一个简单的用户名和密码组件，没有一个验证功能，可能会在一定程度上降价系统的安全性。同时也有小伙伴提出了此功能，所以借此机会把这个验证组件添加到项目中。
具体位置在: `src/components/common/VerifySimple.vue`。效果如下
- 新增：`FormItem`类型新增`optionItemsRef?:Ref<Array<SelectOptionItem | TreeSelectOption>>` 属性，方便在在异步获取 下拉选项的时候，动态添加数据。
方便在FormItem `select` 选项是动态的时候，可以异步添加 select 选项。
代码如下：
// 定义 export interface FormItem extends TableSearchItem { required?: boolean validator?: (value: FormItem, message: MessageApi) => boolean hidden?: boolean inputType?: string maxLength?: number rows?: number disabled?: Ref<boolean> | boolean optionItems?: Array<SelectOptionItem | TreeSelectOption> optionItemsRef?: Ref<Array<SelectOptionItem | TreeSelectOption>> path?: string reset?: (formItem: FormItem) => void render?: (formItem: FormItem) => VNode } // 具体使用场景参考 `base-form-view.vue` 文件，部分源码如下 const formItems = [ …… { label: '起止地点', key: 'address', value: ref(null), optionItemsRef: ref([]), render: (formItem) => renderSelect(formItem.value, formItem.optionItemsRef!.value as SelectOption[], { placeholder: '请选择会议地点', clearable: true, }), }, …… ] as FormItem[] setTimeout(() => { const tempItem = formItems.find((it) => it.key === 'address') tempItem!.optionItemsRef!.value = [ { label: '会议一室', value: 1, }, { label: '会议二室', value: 2, }, { label: '会议三室', value: 3, }, { label: '会议四室', value: 4, }, ] }, 3000)
- 优化：`权限按钮` 展示位置时是 `default`，（default 默认是所有位置都展示） `top` 和 `tablLine` 都展示
- 微调：`main.vue` 和 `work-place.vue` 块样式 和 间距
- 修复：`menu.vue`页面中没有`onPermissionButtonClick` 的 bug
- 优化：增大 `setting` 页面 `z-index` 的比重
好消息
- 为了方便使用 VueAdminWork框架，现在VueAdminWork官网开放 Arco Work版的操作文档。大家可以去官网进行查看，目前文档还正在编写中，Arco Work版本写完之后会继续编写其它版本的文档，敬请期待。官网地址如下
http://www.vueadminwork.com/ - 一直以来想把Vue中常用的功能都封装成一个个简单的组件。随着VueAdminWork用户使用不断增加，此工程也已经提上日程。
VueAdminWork官网中也新增了 "物料" 功能。目前正在研发不同的组件。后期会不断更新新的好用的组件。
到时，大家可以下载不同的组件然后集成到项目中，这样可以方便快速的完成功能的开发。
