Base

方法

  • useStore 数据缓存

    1. app 应用信息,应用名称,配置参数

    2. user 用户信息,用户设置,退出等

    3. menu 菜单信息,路由列表,菜单组

    import { useStore } from "/$/base";
    
    const { app, user, menu } = useStore();
    
  • 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 | number36
shape模式string'square' | 'circle''square'
background-color背景颜色string颜色值#f7f7f7
color字体颜色string颜色值#cccccc

cl-code-json

json 格式预览

参数说明类型可选值默认值
modelValue绑定值string | object
popover是否弹出框模式booleanfalse
height高度string | number100%
maxHeight最大高度string | number300

默认:

弹出框模式:

cl-svg

svg 图标,加载所有模块下 staticicon-*.svg 的文件

参数说明类型可选值默认值
name图标名称,对应文件名string
className样式名称string
size图标大小string / number

cl-image

图片,已配置点击预览

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

cl-editor

由于第三方编辑器资源过大,不一定每个人都需要,so 使用该组件去渲染不确定的第三方编辑器,当第三方编辑器未注册的时候显示文本域 textarea。

参考 /src/modules/base/views/params.vue

参数说明类型
name组件标签名string

WARNING

由于是完全继承,所以该组件可以调用 name 指定组件的所有方法和 支持所有的 prop 参数

<template>
	<cl-editor :ref="setRefs('editor')" name="cl-editor-monaco" :height="400" />
</template>

<script lang="ts" setup>
	const { refs, setRefs } = useCool();

	// 调用格式化代码方法
	refs.editor.formatCode();
</script>
Last Updated: