Base

方法

useStore 数据缓存
1. app 应用信息，应用名称，配置参数
2. user 用户信息，用户设置，退出等
3. menu 菜单信息，路由列表，菜单组
```
import { useStore } from "/$/base";

const { app, user, menu } = useStore();
```
1
2
3

checkPerm(value: string | { or?: string[]; and?: string[] }) 检测是否有权限

import { checkPerm } from "/$/base";
import { useCool } from "/@/cool";

const { service } = useCool();

// 单个
checkPerm(service.base.sys.user.permission.add);

// 或者
checkPerm({
	or: [service.base.sys.user.permission.add, service.base.sys.user.permission.update]
});

// 并且
checkPerm({
	and: [service.base.sys.user.permission.add, service.base.sys.user.permission.update]
});

组件

cl-avatar

头像

参数	说明	类型	可选值	默认值
modelValue	资源链接	string
src	资源链接	string
size	尺寸	string / number		36
shape	模式	string	square / circle	square
background-color	背景颜色	string	颜色值	#f7f7f7
color	字体颜色	string	颜色值	#cccccc

cl-column-custom

cl-table 自定义列

参数	说明	类型	可选值	默认值
name	`localStorage` 存储标识，必填	string
columns	和 ClTable.Column 一样	string

cl-date-text

日期文本显示

参数	说明	类型	可选值	默认值
modelValue	绑定值	string
format	日期格式	string		YYYY-MM-DD HH:mm:ss

cl-svg

svg 图标，加载所有模块下 static 下 icon-*.svg 的文件

参数	说明	类型
name	图标名称，对应文件名	string
className	样式名称	string
size	图标大小	string / number

cl-image

图片，已配置点击预览

参数	说明	类型	可选值	默认值
modelValue	资源链接	string / array
src	资源链接	string / array
size	图片大小	number / array		100
fit	裁剪方式	string	fill / contain / cover / none / scale-down	cover

cl-select

下拉选择，设置 prop 会自动刷新列表并带入请求参数 { page: 1, [prop]: value }

参数	说明	类型
modelValue	绑定值	string / number
options	列表	array
prop	字段	string

cl-switch

开关，cl-table 中使用，值改变时会自动调用 update 接口

参数	说明	类型	默认值
modelValue	绑定值	number / string / boolean
activeValue	选中值	number / string / boolean	true
inactiveValue	未选值	number / string / boolean	false

cl-view-group

左右两侧布局，以兼容手机端

插槽

插槽名	说明
left	左侧菜单
right	右侧内容

暴露变量、方法

参数	说明	类型	默认值
selected	选中值	执行 `select` 方法后传入的值
isExpand	是否展开状态	boolean	true
setTitle	修改右侧标题	function(title: stirng)
expand	展开、收起	function(status?: boolean)
select	选择某一项	function(item:any)

示例

必须绑定 ref="ViewGroup"，这样子组件才能使用 useViewGroup 获取

<cl-view-group ref="ViewGroup">
	<template #left>菜单</template>
	<template #right>内容</template>
</cl-view-group>

<script setup lang="ts">
	import { useViewGroup } from "/$/base";

	const { ViewGroup } = useViewGroup();

	// 设置标题
	ViewGroup.value.setTitle("标题");
</script>

# Base

# 方法

# 组件

# cl-avatar

# cl-column-custom

# cl-date-text

# cl-svg

# cl-image

# cl-select

# cl-switch

# cl-view-group

# 插槽

# 暴露变量、方法

# 示例