提交 314af25a 作者: 方治民

feat: 接入 pont 接口生成工具、统一代码格式

上级 ebec3835
...@@ -14,6 +14,7 @@ VITE_DROP_CONSOLE = false ...@@ -14,6 +14,7 @@ VITE_DROP_CONSOLE = false
# Basic interface address SPA # Basic interface address SPA
VITE_GLOB_API_URL=/basic-api VITE_GLOB_API_URL=/basic-api
# VITE_GLOB_API_URL=http://localhost:8181/basic-api
# File upload address, optional # File upload address, optional
VITE_GLOB_UPLOAD_URL=/upload VITE_GLOB_UPLOAD_URL=/upload
......
...@@ -15,11 +15,7 @@ module.exports = { ...@@ -15,11 +15,7 @@ module.exports = {
jsx: true, jsx: true,
}, },
}, },
extends: [ extends: ['plugin:vue/vue3-recommended', 'plugin:@typescript-eslint/recommended', 'plugin:prettier/recommended'],
'plugin:vue/vue3-recommended',
'plugin:@typescript-eslint/recommended',
'plugin:prettier/recommended',
],
rules: { rules: {
'vue/script-setup-uses-vars': 'error', 'vue/script-setup-uses-vars': 'error',
'@typescript-eslint/ban-ts-ignore': 'off', '@typescript-eslint/ban-ts-ignore': 'off',
......
...@@ -27,3 +27,5 @@ pnpm-debug.log* ...@@ -27,3 +27,5 @@ pnpm-debug.log*
*.njsproj *.njsproj
*.sln *.sln
*.sw? *.sw?
.mocks/
\ No newline at end of file
...@@ -33,7 +33,6 @@ ...@@ -33,7 +33,6 @@
}, },
"files.exclude": { "files.exclude": {
"**/.cache": true, "**/.cache": true,
"**/.editorconfig": true,
"**/.eslintcache": true, "**/.eslintcache": true,
"**/bower_components": true, "**/bower_components": true,
"**/.idea": true, "**/.idea": true,
......
...@@ -9,12 +9,7 @@ export function resultSuccess<T = Recordable>(result: T, { message = 'ok' } = {} ...@@ -9,12 +9,7 @@ export function resultSuccess<T = Recordable>(result: T, { message = 'ok' } = {}
} }
} }
export function resultPageSuccess<T = any>( export function resultPageSuccess<T = any>(page: number, pageSize: number, list: T[], { message = 'ok' } = {}) {
page: number,
pageSize: number,
list: T[],
{ message = 'ok' } = {},
) {
const pageData = pagination(page, pageSize, list) const pageData = pagination(page, pageSize, list)
return { return {
......
...@@ -88,11 +88,9 @@ const menuList = (() => { ...@@ -88,11 +88,9 @@ const menuList = (() => {
menuName: ['菜单1', '菜单2', '菜单3', '菜单4'][j], menuName: ['菜单1', '菜单2', '菜单3', '菜单4'][j],
icon: 'ion:document', icon: 'ion:document',
permission: ['menu1:view', 'menu2:add', 'menu3:update', 'menu4:del'][index], permission: ['menu1:view', 'menu2:add', 'menu3:update', 'menu4:del'][index],
component: [ component: ['/dashboard/welcome/index', '/dashboard/workbench/index', '/dashboard/test/index'][
'/dashboard/welcome/index', j
'/dashboard/workbench/index', ],
'/dashboard/test/index',
][j],
orderNo: j + 1, orderNo: j + 1,
createTime: '@datetime', createTime: '@datetime',
'status|1': ['0', '1'], 'status|1': ['0', '1'],
...@@ -106,9 +104,7 @@ const menuList = (() => { ...@@ -106,9 +104,7 @@ const menuList = (() => {
menuName: '按钮' + (j + 1) + '-' + (k + 1), menuName: '按钮' + (j + 1) + '-' + (k + 1),
icon: '', icon: '',
permission: permission:
['menu1:view', 'menu2:add', 'menu3:update', 'menu4:del'][ ['menu1:view', 'menu2:add', 'menu3:update', 'menu4:del'][index] +
index
] +
':btn' + ':btn' +
(k + 1), (k + 1),
component: [ component: [
......
...@@ -241,13 +241,11 @@ export default [ ...@@ -241,13 +241,11 @@ export default [
let menu: Object[] let menu: Object[]
switch (id) { switch (id) {
case '1': case '1':
dashboardRoute.redirect = dashboardRoute.redirect = dashboardRoute.path + '/' + dashboardRoute.children[0].path
dashboardRoute.path + '/' + dashboardRoute.children[0].path
menu = [dashboardRoute, authRoute, levelRoute, sysRoute, linkRoute] menu = [dashboardRoute, authRoute, levelRoute, sysRoute, linkRoute]
break break
case '2': case '2':
dashboardRoute.redirect = dashboardRoute.redirect = dashboardRoute.path + '/' + dashboardRoute.children[1].path
dashboardRoute.path + '/' + dashboardRoute.children[1].path
menu = [dashboardRoute, authRoute, levelRoute, linkRoute] menu = [dashboardRoute, authRoute, levelRoute, linkRoute]
break break
default: default:
......
...@@ -132,6 +132,7 @@ ...@@ -132,6 +132,7 @@
"lint-staged": "12.3.7", "lint-staged": "12.3.7",
"npm-run-all": "^4.1.5", "npm-run-all": "^4.1.5",
"picocolors": "^1.0.0", "picocolors": "^1.0.0",
"pont-engine": "^1.2.0",
"postcss": "^8.4.12", "postcss": "^8.4.12",
"postcss-html": "^1.3.0", "postcss-html": "^1.3.0",
"postcss-less": "^6.0.0", "postcss-less": "^6.0.0",
......
{
"originUrl": "http://localhost:8181/basic-api/v2/api-docs",
"templatePath": "./pont.template",
"outDir": "./src/api/services",
"surrounding": "typeScript",
"mocks": {
"enable": true,
"basePath": "",
"port": 3101,
"wrapper": "{\"status\": 200, \"body\": {response}, \"message\": \"OK\"}"
},
"templateType": "fetch",
"prettierConfig": {
"printWidth": 120,
"semi": false,
"tabWidth": 4,
"singleQuote": true,
"trailingComma": "all",
"proseWrap": "never",
"endOfLine": "lf"
}
}
import { Interface, BaseClass, Property, CodeGenerator } from 'pont-engine'
export default class MyGenerator extends CodeGenerator {
getParams(inter: Interface) {
const requestParams = inter.getRequestParams(this.surrounding)
return `${requestParams.replace(
'options?: any',
`config?: axios.RequestConfig<Params${requestParams.includes('form') ? ' | FormData' : ''}>`,
)}, options?: axios.RequestOptions`
}
getInterfaceContentInDeclaration(inter: Interface) {
const requestParams = this.getParams(inter)
const paramsCode = inter.getParamsCode('Params')
return `
export ${paramsCode}
export type Response = ${inter.responseType.replace(/defs.Result\<(.*)\>/, '$1')};
export const init: Response;
export function request(${requestParams}): Promise<Response>;
`
}
getBaseClassInDeclaration(base: BaseClass) {
const originProps = base.properties
base.properties = base.properties.map((prop) => {
return new Property({
...prop,
required: false,
})
})
const result = super.getBaseClassInDeclaration(base)
base.properties = originProps
return result
}
getInterfaceContent(inter: Interface) {
const method = inter.method.toUpperCase()
const requestParams = this.getParams(inter)
const paramsCode = inter.getParamsCode('Params', this.surrounding)
return `
/**
* @desc ${inter.description}
*/
import * as defs from '../../baseClass';
import { defHttp } from '/@/utils/http/axios'
export ${paramsCode}
export const init = ${inter.response.getInitialValue()};
export function request(${requestParams}) {
return defHttp.request({
url: "${inter.path}",
method: '${method}',
${
method === 'GET'
? 'params'
: `data: ${requestParams.includes('form') ? 'form || params' : 'params'}`
},
...config,
}, options);
}
`
}
}
module.exports = { module.exports = {
printWidth: 100, printWidth: 120,
semi: false, semi: false,
tabWidth: 4, tabWidth: 4,
vueIndentScriptAndStyle: true, vueIndentScriptAndStyle: true,
...@@ -7,5 +7,5 @@ module.exports = { ...@@ -7,5 +7,5 @@ module.exports = {
trailingComma: 'all', trailingComma: 'all',
proseWrap: 'never', proseWrap: 'never',
htmlWhitespaceSensitivity: 'strict', htmlWhitespaceSensitivity: 'strict',
endOfLine: 'auto', endOfLine: 'lf',
} }
This source diff could not be displayed because it is too large. You can view the blob instead.
export class LoginVo {
/** token */
token = ''
}
export class PageVo {
/** 数据 */
data = []
/** 数据最新时间 */
latest = ''
/** 数据总数 */
total = undefined
}
export class PermissionVo {
/** 子权限 */
children = []
/** 组件 */
component = ''
/** 是否启用 */
enable = false
/** 是否隐藏 */
hidden = false
/** 图标 */
icon = ''
/** 主键 */
id = undefined
/** 名称 */
name = ''
/** 路径 */
path = ''
/** 父级ID */
pid = undefined
/** 序号 */
serial = undefined
/** 权限类型 */
type = 'MENU'
/** 标识 */
uid = ''
}
export class Result {
/** 内容 */
body = new LoginVo()
/** 业务标识码 */
code = undefined
/** 详细信息 */
details = ''
/** 异常信息 */
error = ''
/** 消息 */
message = ''
/** 状态码 */
status = undefined
/** 耗时 */
times = ''
/** 响应时间 */
timestamp = ''
}
export class RoleVo {
/** 主键 */
id = undefined
/** 名称 */
name = ''
/** 权限 */
permissions = []
/** 标识 */
uid = ''
}
export class UserInfo {
/** 头像 */
avatar = ''
/** 邮箱 */
email = ''
/** 主页地址 */
homePath = ''
/** 手机号 */
mobile = ''
/** 权限 */
permissions = []
/** 真实姓名 */
realName = ''
/** 角色 */
roles = []
/** 职称 */
title = ''
/** 主键 */
userId = undefined
/** 用户名 */
username = ''
}
export class UserVo {
/** 头像 */
avatar = ''
/** 最后登录时间 */
createTime = ''
/** 是否删除 */
deleted = false
/** 邮箱 */
email = ''
/** 是否启用 */
enabled = false
/** 主键 */
id = undefined
/** 最后登录IP地址 */
lastLoginIp = ''
/** 最后登录时间 */
lastLoginTime = ''
/** 手机号 */
mobile = ''
/** 真实姓名 */
realName = ''
/** 职称 */
title = ''
/** 用户名 */
username = ''
}
import * as defs from './baseClass'
import './mods/'
;(window as any).defs = defs
/**
* @description
*/
import * as login from './login'
import * as logout from './logout'
import * as register from './register'
export { login, logout, register }
/**
* @desc 登录
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {
/** 账号(支持用户名/手机号/邮箱) */
account: string
/** 密码 */
password: string
}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/auth/login',
method: 'POST',
data: params,
...config,
},
options,
)
}
/**
* @desc 登出
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/auth/logout',
method: 'GET',
params,
...config,
},
options,
)
}
/**
* @desc 注册
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {
/** 头像 */
avatar?: string
/** 邮箱 */
email?: string
/** 是否启用 */
enable?: boolean
/** 手机号 */
mobile: string
/** 密码 */
password: string
/** 真实姓名 */
realName: string
/** 职称 */
title?: string
/** 用户名 */
username: string
}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/auth/register',
method: 'POST',
data: params,
...config,
},
options,
)
}
/**
* @desc fail
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/hello/fail',
method: 'GET',
params,
...config,
},
options,
)
}
/**
* @desc hello
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/hello/',
method: 'GET',
params,
...config,
},
options,
)
}
/**
* @description
*/
import * as hello from './hello'
import * as fail from './fail'
import * as page from './page'
export { hello, fail, page }
/**
* @desc page
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {
/** 当前页数 */
pageNo: number
/** 分页条数 */
pageSize: number
/** 排序字段 */
sortField?: string
/** 排序方向(ASC|DESC) */
sortOrder?: 'ASC' | 'DESC'
}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/hello/page',
method: 'GET',
params,
...config,
},
options,
)
}
import * as auth from './auth'
import * as hello from './hello'
import * as minio from './minio'
import * as permission from './permission'
import * as role from './role'
import * as user from './user'
;(window as any).API = {
auth,
hello,
minio,
permission,
role,
user,
}
/**
* @description
*/
import * as upload from './upload'
export { upload }
/**
* @desc 文件上传
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {}
export const init = new defs.Result()
export function request(
params: Params,
form: FormData,
config?: axios.RequestConfig<Params | FormData>,
options?: axios.RequestOptions,
) {
return defHttp.request(
{
url: '/basic-api/common/minio/upload',
method: 'POST',
data: form || params,
...config,
},
options,
)
}
/**
* @desc 新增
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {
/** 组件 */
component?: string
/** 是否启用 */
enable?: boolean
/** 是否隐藏 */
hidden?: boolean
/** 图标 */
icon?: string
/** 名称 */
name: string
/** 路径 */
path?: string
/** 父级ID */
pid?: number
/** 序号 */
serial?: number
/** 权限类型 */
type: 'MENU' | 'BUTTON'
/** 标识 */
uid: string
}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/manage/permission/add',
method: 'POST',
data: params,
...config,
},
options,
)
}
/**
* @desc 删除
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {
/** id */
id: number
}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/manage/permission/deleted',
method: 'POST',
data: params,
...config,
},
options,
)
}
/**
* @desc 查询
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {
/** id */
id: number
}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/manage/permission/find',
method: 'GET',
params,
...config,
},
options,
)
}
/**
* @description
*/
import * as add from './add'
import * as deleted from './deleted'
import * as find from './find'
import * as modify from './modify'
import * as page from './page'
import * as tree from './tree'
export { add, deleted, find, modify, page, tree }
/**
* @desc 修改
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {
/** 组件 */
component?: string
/** 是否启用 */
enable?: boolean
/** 是否隐藏 */
hidden?: boolean
/** 图标 */
icon?: string
/** id */
id: number
/** 名称 */
name: string
/** 路径 */
path?: string
/** 父级ID */
pid?: number
/** 序号 */
serial?: number
/** 权限类型 */
type: 'MENU' | 'BUTTON'
/** 标识 */
uid: string
}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/manage/permission/modify',
method: 'POST',
data: params,
...config,
},
options,
)
}
/**
* @desc 分页查询
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {
/** 当前页数 */
pageNo: number
/** 分页条数 */
pageSize: number
/** 排序字段 */
sortField?: string
/** 排序方向(ASC|DESC) */
sortOrder?: 'ASC' | 'DESC'
}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/manage/permission/page',
method: 'GET',
params,
...config,
},
options,
)
}
/**
* @desc 树结构查询
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {
/** 父级 id */
pid?: number
}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/manage/permission/tree',
method: 'GET',
params,
...config,
},
options,
)
}
/**
* @desc 新增
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {
/** 名称 */
name: string
/** 标识 */
uid: string
}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/manage/role/add',
method: 'POST',
data: params,
...config,
},
options,
)
}
/**
* @desc 分配权限
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {
/** id */
id: number
/** ids 多个以逗号分割 */
ids: string
}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/manage/role/assign',
method: 'POST',
data: params,
...config,
},
options,
)
}
/**
* @desc 删除
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {
/** id */
id: number
}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/manage/role/deleted',
method: 'POST',
data: params,
...config,
},
options,
)
}
/**
* @desc 查询
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {
/** id */
id: number
}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/manage/role/find',
method: 'GET',
params,
...config,
},
options,
)
}
/**
* @description
*/
import * as add from './add'
import * as assign from './assign'
import * as deleted from './deleted'
import * as find from './find'
import * as modify from './modify'
import * as page from './page'
import * as selector from './selector'
export { add, assign, deleted, find, modify, page, selector }
/**
* @desc 修改
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {
/** id */
id: number
/** 名称 */
name: string
/** 标识 */
uid: string
}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/manage/role/modify',
method: 'POST',
data: params,
...config,
},
options,
)
}
/**
* @desc 分页查询
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {
/** 当前页数 */
pageNo: number
/** 分页条数 */
pageSize: number
/** 排序字段 */
sortField?: string
/** 排序方向(ASC|DESC) */
sortOrder?: 'ASC' | 'DESC'
}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/manage/role/page',
method: 'GET',
params,
...config,
},
options,
)
}
/**
* @desc 选项查询
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/manage/role/selector',
method: 'GET',
params,
...config,
},
options,
)
}
/**
* @desc 分配角色
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {
/** id */
id: number
/** ids 多个以逗号分割 */
ids: string
}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/user/manage/assign',
method: 'POST',
data: params,
...config,
},
options,
)
}
/**
* @description
*/
import * as info from './info'
import * as assign from './assign'
import * as page from './page'
export { info, assign, page }
/**
* @desc 获取登录用户信息
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/user/info',
method: 'GET',
params,
...config,
},
options,
)
}
/**
* @desc 分页查询
*/
import * as defs from '../../baseClass'
import { defHttp } from '/@/utils/http/axios'
export class Params {
/** 当前页数 */
pageNo: number
/** 分页条数 */
pageSize: number
/** 排序字段 */
sortField?: string
/** 排序方向(ASC|DESC) */
sortOrder?: 'ASC' | 'DESC'
}
export const init = new defs.Result()
export function request(params: Params, config?: axios.RequestConfig<Params>, options?: axios.RequestOptions) {
return defHttp.request(
{
url: '/basic-api/user/manage/page',
method: 'GET',
params,
...config,
},
options,
)
}
...@@ -8,10 +8,7 @@ const { uploadUrl = '' } = useGlobSetting() ...@@ -8,10 +8,7 @@ const { uploadUrl = '' } = useGlobSetting()
/** /**
* @description: Upload interface * @description: Upload interface
*/ */
export function uploadApi( export function uploadApi(params: UploadFileParams, onUploadProgress: (progressEvent: ProgressEvent) => void) {
params: UploadFileParams,
onUploadProgress: (progressEvent: ProgressEvent) => void,
) {
return defHttp.uploadFile<UploadApiResult>( return defHttp.uploadFile<UploadApiResult>(
{ {
url: uploadUrl, url: uploadUrl,
......
...@@ -45,12 +45,7 @@ ...@@ -45,12 +45,7 @@
if (!unref(isSetState)) { if (!unref(isSetState)) {
isSetState.value = true isSetState.value = true
const { const {
menuSetting: { menuSetting: { type: menuType, mode: menuMode, collapsed: menuCollapsed, split: menuSplit },
type: menuType,
mode: menuMode,
collapsed: menuCollapsed,
split: menuSplit,
},
} = appStore.getProjectConfig } = appStore.getProjectConfig
appStore.setProjectConfig({ appStore.setProjectConfig({
menuSetting: { menuSetting: {
...@@ -64,8 +59,7 @@ ...@@ -64,8 +59,7 @@
} else { } else {
if (unref(isSetState)) { if (unref(isSetState)) {
isSetState.value = false isSetState.value = false
const { menuMode, menuCollapsed, menuType, menuSplit } = const { menuMode, menuCollapsed, menuType, menuSplit } = appStore.getBeforeMiniInfo
appStore.getBeforeMiniInfo
appStore.setProjectConfig({ appStore.setProjectConfig({
menuSetting: { menuSetting: {
type: menuType, type: menuType,
......
...@@ -24,10 +24,7 @@ ...@@ -24,10 +24,7 @@
default: () => <SearchOutlined />, default: () => <SearchOutlined />,
}} }}
</Tooltip> </Tooltip>
<AppSearchModal <AppSearchModal onClose={changeModal.bind(null, false)} visible={unref(showModal)} />
onClose={changeModal.bind(null, false)}
visible={unref(showModal)}
/>
</div> </div>
) )
} }
......
...@@ -41,8 +41,7 @@ ...@@ -41,8 +41,7 @@
margin-right: 0.4em; margin-right: 0.4em;
background-color: linear-gradient(-225deg, #d5dbe4, #f8f8f8); background-color: linear-gradient(-225deg, #d5dbe4, #f8f8f8);
border-radius: 2px; border-radius: 2px;
box-shadow: inset 0 -2px 0 0 #cdcde6, inset 0 0 1px 1px #fff, box-shadow: inset 0 -2px 0 0 #cdcde6, inset 0 0 1px 1px #fff, 0 1px 2px 1px rgb(30 35 90 / 40%);
0 1px 2px 1px rgb(30 35 90 / 40%);
align-items: center; align-items: center;
justify-content: center; justify-content: center;
......
...@@ -84,8 +84,11 @@ ...@@ -84,8 +84,11 @@
const [refs, setRefs] = useRefs() const [refs, setRefs] = useRefs()
const { getIsMobile } = useAppInject() const { getIsMobile } = useAppInject()
const { handleSearch, searchResult, keyword, activeIndex, handleEnter, handleMouseenter } = const { handleSearch, searchResult, keyword, activeIndex, handleEnter, handleMouseenter } = useMenuSearch(
useMenuSearch(refs, scrollWrap, emit) refs,
scrollWrap,
emit,
)
const getIsNotData = computed(() => !keyword || unref(searchResult).length === 0) const getIsNotData = computed(() => !keyword || unref(searchResult).length === 0)
......
...@@ -18,9 +18,7 @@ ...@@ -18,9 +18,7 @@
* @default '' * @default ''
*/ */
value: { value: {
type: [Number, Array, String] as PropType< type: [Number, Array, String] as PropType<RoleEnum | RoleEnum[] | string | string[]>,
RoleEnum | RoleEnum[] | string | string[]
>,
default: '', default: '',
}, },
}, },
......
...@@ -46,9 +46,7 @@ ...@@ -46,9 +46,7 @@
setup(props, { slots }) { setup(props, { slots }) {
const { prefixCls } = useDesign('basic-help') const { prefixCls } = useDesign('basic-help')
const getTooltipStyle = computed( const getTooltipStyle = computed((): CSSProperties => ({ color: props.color, fontSize: props.fontSize }))
(): CSSProperties => ({ color: props.color, fontSize: props.fontSize }),
)
const getOverlayStyle = computed((): CSSProperties => ({ maxWidth: props.maxWidth })) const getOverlayStyle = computed((): CSSProperties => ({ maxWidth: props.maxWidth }))
......
...@@ -15,11 +15,7 @@ ...@@ -15,11 +15,7 @@
<Tooltip> <Tooltip>
<template #title> <template #title>
<div class="w-50">每行显示数量</div <div class="w-50">每行显示数量</div
><Slider ><Slider id="slider" v-bind="sliderProp" v-model:value="grid" @change="sliderChange"
id="slider"
v-bind="sliderProp"
v-model:value="grid"
@change="sliderChange"
/></template> /></template>
<Button><TableOutlined /></Button> <Button><TableOutlined /></Button>
</Tooltip> </Tooltip>
...@@ -61,10 +57,7 @@ ...@@ -61,10 +57,7 @@
<CardMeta> <CardMeta>
<template #title> <template #title>
<TypographyText <TypographyText :content="item.name" :ellipsis="{ tooltip: item.address }" />
:content="item.name"
:ellipsis="{ tooltip: item.address }"
/>
</template> </template>
<template #avatar> <template #avatar>
<Avatar :src="item.avatar" /> <Avatar :src="item.avatar" />
...@@ -80,12 +73,7 @@ ...@@ -80,12 +73,7 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { computed, onMounted, ref } from 'vue' import { computed, onMounted, ref } from 'vue'
import { import { EditOutlined, EllipsisOutlined, RedoOutlined, TableOutlined } from '@ant-design/icons-vue'
EditOutlined,
EllipsisOutlined,
RedoOutlined,
TableOutlined,
} from '@ant-design/icons-vue'
import { List, Card, Image, Typography, Tooltip, Slider, Avatar } from 'ant-design-vue' import { List, Card, Image, Typography, Tooltip, Slider, Avatar } from 'ant-design-vue'
import { Dropdown } from '/@/components/Dropdown' import { Dropdown } from '/@/components/Dropdown'
import { BasicForm, useForm } from '/@/components/Form' import { BasicForm, useForm } from '/@/components/Form'
......
<template> <template>
<div class="h-full"> <div class="h-full">
<CodeMirrorEditor <CodeMirrorEditor :value="getValue" @change="handleValueChange" :mode="mode" :readonly="readonly" />
:value="getValue"
@change="handleValueChange"
:mode="mode"
:readonly="readonly"
/>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
......
...@@ -66,10 +66,7 @@ ...@@ -66,10 +66,7 @@
) )
function setTheme() { function setTheme() {
unref(editor)?.setOption( unref(editor)?.setOption('theme', appStore.getDarkMode === 'light' ? 'idea' : 'material-palenight')
'theme',
appStore.getDarkMode === 'light' ? 'idea' : 'material-palenight',
)
} }
function refresh() { function refresh() {
......
<template> <template>
<transition-group <transition-group class="h-full w-full" v-bind="$attrs" ref="elRef" :name="transitionName" :tag="tag" mode="out-in">
class="h-full w-full"
v-bind="$attrs"
ref="elRef"
:name="transitionName"
:tag="tag"
mode="out-in"
>
<div key="component" v-if="isInit"> <div key="component" v-if="isInit">
<slot :loading="loading"></slot> <slot :loading="loading"></slot>
</div> </div>
...@@ -39,9 +32,7 @@ ...@@ -39,9 +32,7 @@
* If the component is scrolling in the page container, the viewport is the container * If the component is scrolling in the page container, the viewport is the container
*/ */
viewport: { viewport: {
type: (typeof window !== 'undefined' type: (typeof window !== 'undefined' ? window.HTMLElement : Object) as PropType<HTMLElement>,
? window.HTMLElement
: Object) as PropType<HTMLElement>,
default: () => null, default: () => null,
}, },
/** /**
...@@ -124,8 +115,7 @@ ...@@ -124,8 +115,7 @@
rootMargin, rootMargin,
target: toRef(elRef.value, '$el'), target: toRef(elRef.value, '$el'),
onIntersect: (entries: any[]) => { onIntersect: (entries: any[]) => {
const isIntersecting = const isIntersecting = entries[0].isIntersecting || entries[0].intersectionRatio
entries[0].isIntersecting || entries[0].intersectionRatio
if (isIntersecting) { if (isIntersecting) {
init() init()
if (observer) { if (observer) {
......
...@@ -31,11 +31,7 @@ ...@@ -31,11 +31,7 @@
const ItemContent: FunctionalComponent<ItemContentProps> = (props) => { const ItemContent: FunctionalComponent<ItemContentProps> = (props) => {
const { item } = props const { item } = props
return ( return (
<span <span style="display: inline-block; width: 100%; " class="px-4" onClick={props.handler.bind(null, item)}>
style="display: inline-block; width: 100%; "
class="px-4"
onClick={props.handler.bind(null, item)}
>
{props.showIcon && item.icon && <Icon class="mr-2" icon={item.icon} />} {props.showIcon && item.icon && <Icon class="mr-2" icon={item.icon} />}
<span>{item.label}</span> <span>{item.label}</span>
</span> </span>
...@@ -101,11 +97,7 @@ ...@@ -101,11 +97,7 @@
if (!children || children.length === 0) { if (!children || children.length === 0) {
return ( return (
<> <>
<Menu.Item <Menu.Item disabled={disabled} class={`${prefixCls}__item`} key={label}>
disabled={disabled}
class={`${prefixCls}__item`}
key={label}
>
<ItemContent {...contentProps} /> <ItemContent {...contentProps} />
</Menu.Item> </Menu.Item>
{divider ? <Divider key={`d-${label}`} /> : null} {divider ? <Divider key={`d-${label}`} /> : null}
...@@ -115,11 +107,7 @@ ...@@ -115,11 +107,7 @@
if (!unref(showRef)) return null if (!unref(showRef)) return null
return ( return (
<Menu.SubMenu <Menu.SubMenu key={label} disabled={disabled} popupClassName={`${prefixCls}__popup`}>
key={label}
disabled={disabled}
popupClassName={`${prefixCls}__popup`}
>
{{ {{
title: () => <ItemContent {...contentProps} />, title: () => <ItemContent {...contentProps} />,
default: () => renderMenuItem(children), default: () => renderMenuItem(children),
...@@ -135,12 +123,7 @@ ...@@ -135,12 +123,7 @@
const { items } = props const { items } = props
return ( return (
<div class={prefixCls}> <div class={prefixCls}>
<Menu <Menu inlineIndent={12} mode="vertical" ref={wrapRef} style={unref(getStyle)}>
inlineIndent={12}
mode="vertical"
ref={wrapRef}
style={unref(getStyle)}
>
{renderMenuItem(items)} {renderMenuItem(items)}
</Menu> </Menu>
</div> </div>
...@@ -191,8 +174,7 @@ ...@@ -191,8 +174,7 @@
background-color: @component-background; background-color: @component-background;
border: 1px solid rgb(0 0 0 / 8%); border: 1px solid rgb(0 0 0 / 8%);
border-radius: 0.25rem; border-radius: 0.25rem;
box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 10%), box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 10%), 0 1px 5px 0 rgb(0 0 0 / 6%);
0 1px 5px 0 rgb(0 0 0 / 6%);
background-clip: padding-box; background-clip: padding-box;
user-select: none; user-select: none;
......
<template> <template>
<a-input v-bind="$attrs" :class="prefixCls" :size="size" :value="state"> <a-input v-bind="$attrs" :class="prefixCls" :size="size" :value="state">
<template #addonAfter> <template #addonAfter>
<CountButton <CountButton :size="size" :count="count" :value="state" :beforeStartFunc="sendCodeApi" />
:size="size"
:count="count"
:value="state"
:beforeStartFunc="sendCodeApi"
/>
</template> </template>
<template <template #[item]="data" v-for="item in Object.keys($slots).filter((k) => k !== 'addonAfter')">
#[item]="data"
v-for="item in Object.keys($slots).filter((k) => k !== 'addonAfter')"
>
<slot :name="item" v-bind="data || {}"></slot> <slot :name="item" v-bind="data || {}"></slot>
</template> </template>
</a-input> </a-input>
......
...@@ -24,11 +24,7 @@ ...@@ -24,11 +24,7 @@
<div :class="`${prefixCls}-toolbar`"> <div :class="`${prefixCls}-toolbar`">
<Upload :fileList="[]" accept="image/*" :beforeUpload="handleBeforeUpload"> <Upload :fileList="[]" accept="image/*" :beforeUpload="handleBeforeUpload">
<Tooltip :title="t('component.cropper.selectImage')" placement="bottom"> <Tooltip :title="t('component.cropper.selectImage')" placement="bottom">
<a-button <a-button size="small" preIcon="ant-design:upload-outlined" type="primary" />
size="small"
preIcon="ant-design:upload-outlined"
type="primary"
/>
</Tooltip> </Tooltip>
</Upload> </Upload>
<Space> <Space>
...@@ -50,10 +46,7 @@ ...@@ -50,10 +46,7 @@
@click="handlerToolbar('rotate', -45)" @click="handlerToolbar('rotate', -45)"
/> />
</Tooltip> </Tooltip>
<Tooltip <Tooltip :title="t('component.cropper.btn_rotate_right')" placement="bottom">
:title="t('component.cropper.btn_rotate_right')"
placement="bottom"
>
<a-button <a-button
type="primary" type="primary"
preIcon="ant-design:rotate-right-outlined" preIcon="ant-design:rotate-right-outlined"
...@@ -103,11 +96,7 @@ ...@@ -103,11 +96,7 @@
</div> </div>
<div :class="`${prefixCls}-right`"> <div :class="`${prefixCls}-right`">
<div :class="`${prefixCls}-preview`"> <div :class="`${prefixCls}-preview`">
<img <img :src="previewSource" v-if="previewSource" :alt="t('component.cropper.preview')" />
:src="previewSource"
v-if="previewSource"
:alt="t('component.cropper.preview')"
/>
</div> </div>
<template v-if="previewSource"> <template v-if="previewSource">
<div :class="`${prefixCls}-group`"> <div :class="`${prefixCls}-group`">
...@@ -250,13 +239,7 @@ ...@@ -250,13 +239,7 @@
transparent 75%, transparent 75%,
rgb(0 0 0 / 25%) 0 rgb(0 0 0 / 25%) 0
), ),
linear-gradient( linear-gradient(45deg, rgb(0 0 0 / 25%) 25%, transparent 0, transparent 75%, rgb(0 0 0 / 25%) 0);
45deg,
rgb(0 0 0 / 25%) 25%,
transparent 0,
transparent 75%,
rgb(0 0 0 / 25%) 0
);
background-position: 0 0, 12px 12px; background-position: 0 0, 12px 12px;
background-size: 24px 24px; background-size: 24px 24px;
} }
......
<template> <template>
<div :class="getClass" :style="getWrapperStyle"> <div :class="getClass" :style="getWrapperStyle">
<img <img v-show="isReady" ref="imgElRef" :src="src" :alt="alt" :crossorigin="crossorigin" :style="getImageStyle" />
v-show="isReady"
ref="imgElRef"
:src="src"
:alt="alt"
:crossorigin="crossorigin"
:style="getImageStyle"
/>
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
...@@ -165,14 +158,7 @@ ...@@ -165,14 +158,7 @@
context.drawImage(sourceCanvas, 0, 0, width, height) context.drawImage(sourceCanvas, 0, 0, width, height)
context.globalCompositeOperation = 'destination-in' context.globalCompositeOperation = 'destination-in'
context.beginPath() context.beginPath()
context.arc( context.arc(width / 2, height / 2, Math.min(width, height) / 2, 0, 2 * Math.PI, true)
width / 2,
height / 2,
Math.min(width, height) / 2,
0,
2 * Math.PI,
true,
)
context.fill() context.fill()
return canvas return canvas
} }
......
...@@ -11,12 +11,7 @@ ...@@ -11,12 +11,7 @@
</div> </div>
<img :src="sourceValue" v-if="sourceValue" alt="avatar" /> <img :src="sourceValue" v-if="sourceValue" alt="avatar" />
</div> </div>
<a-button <a-button :class="`${prefixCls}-upload-btn`" @click="openModal" v-if="showBtn" v-bind="btnProps">
:class="`${prefixCls}-upload-btn`"
@click="openModal"
v-if="showBtn"
v-bind="btnProps"
>
{{ btnText ? btnText : t('component.cropper.selectImage') }} {{ btnText ? btnText : t('component.cropper.selectImage') }}
</a-button> </a-button>
...@@ -29,16 +24,7 @@ ...@@ -29,16 +24,7 @@
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import { import { defineComponent, computed, CSSProperties, unref, ref, watchEffect, watch, PropType } from 'vue'
defineComponent,
computed,
CSSProperties,
unref,
ref,
watchEffect,
watch,
PropType,
} from 'vue'
import CopperModal from './CopperModal.vue' import CopperModal from './CopperModal.vue'
import { useDesign } from '/@/hooks/web/useDesign' import { useDesign } from '/@/hooks/web/useDesign'
import { useModal } from '/@/components/Modal' import { useModal } from '/@/components/Modal'
...@@ -72,9 +58,7 @@ ...@@ -72,9 +58,7 @@
const getWidth = computed(() => `${props.width}`.replace(/px/, '') + 'px') const getWidth = computed(() => `${props.width}`.replace(/px/, '') + 'px')
const getIconWidth = computed( const getIconWidth = computed(() => parseInt(`${props.width}`.replace(/px/, '')) / 2 + 'px')
() => parseInt(`${props.width}`.replace(/px/, '')) / 2 + 'px',
)
const getStyle = computed((): CSSProperties => ({ width: unref(getWidth) })) const getStyle = computed((): CSSProperties => ({ width: unref(getWidth) }))
......
...@@ -12,10 +12,7 @@ export interface DescItem { ...@@ -12,10 +12,7 @@ export interface DescItem {
span?: number span?: number
show?: (...arg: any) => boolean show?: (...arg: any) => boolean
// render // render
render?: ( render?: (val: any, data: Recordable) => VNode | undefined | JSX.Element | Element | string | number
val: any,
data: Recordable,
) => VNode | undefined | JSX.Element | Element | string | number
} }
export interface DescriptionProps extends DescriptionsProps { export interface DescriptionProps extends DescriptionsProps {
......
...@@ -4,9 +4,7 @@ import { isProdMode } from '/@/utils/env' ...@@ -4,9 +4,7 @@ import { isProdMode } from '/@/utils/env'
export function useDescription(props?: Partial<DescriptionProps>): UseDescReturnType { export function useDescription(props?: Partial<DescriptionProps>): UseDescReturnType {
if (!getCurrentInstance()) { if (!getCurrentInstance()) {
throw new Error( throw new Error('useDescription() can only be used inside setup() or functional components!')
'useDescription() can only be used inside setup() or functional components!',
)
} }
const desc = ref<Nullable<DescInstance>>(null) const desc = ref<Nullable<DescInstance>>(null)
const loaded = ref(false) const loaded = ref(false)
......
...@@ -33,16 +33,7 @@ ...@@ -33,16 +33,7 @@
<script lang="ts"> <script lang="ts">
import type { DrawerInstance, DrawerProps } from './typing' import type { DrawerInstance, DrawerProps } from './typing'
import type { CSSProperties } from 'vue' import type { CSSProperties } from 'vue'
import { import { defineComponent, ref, computed, watch, unref, nextTick, toRaw, getCurrentInstance } from 'vue'
defineComponent,
ref,
computed,
watch,
unref,
nextTick,
toRaw,
getCurrentInstance,
} from 'vue'
import { Drawer } from 'ant-design-vue' import { Drawer } from 'ant-design-vue'
import { useI18n } from '/@/hooks/web/useI18n' import { useI18n } from '/@/hooks/web/useI18n'
import { isFunction, isNumber } from '/@/utils/is' import { isFunction, isNumber } from '/@/utils/is'
...@@ -115,9 +106,7 @@ ...@@ -115,9 +106,7 @@
const getFooterHeight = computed(() => { const getFooterHeight = computed(() => {
const { footerHeight, showFooter } = unref(getProps) const { footerHeight, showFooter } = unref(getProps)
if (showFooter && footerHeight) { if (showFooter && footerHeight) {
return isNumber(footerHeight) return isNumber(footerHeight) ? `${footerHeight}px` : `${footerHeight.replace('px', '')}px`
? `${footerHeight}px`
: `${footerHeight.replace('px', '')}px`
} }
return `0px` return `0px`
}) })
......
...@@ -2,12 +2,7 @@ ...@@ -2,12 +2,7 @@
<div :class="prefixCls" :style="getStyle" v-if="showFooter || $slots.footer"> <div :class="prefixCls" :style="getStyle" v-if="showFooter || $slots.footer">
<template v-if="!$slots.footer"> <template v-if="!$slots.footer">
<slot name="insertFooter"></slot> <slot name="insertFooter"></slot>
<a-button <a-button v-bind="cancelButtonProps" @click="handleClose" class="mr-2" v-if="showCancelBtn">
v-bind="cancelButtonProps"
@click="handleClose"
class="mr-2"
v-if="showCancelBtn"
>
{{ cancelText }} {{ cancelText }}
</a-button> </a-button>
<slot name="centerFooter"></slot> <slot name="centerFooter"></slot>
......
...@@ -5,16 +5,7 @@ import type { ...@@ -5,16 +5,7 @@ import type {
DrawerProps, DrawerProps,
UseDrawerInnerReturnType, UseDrawerInnerReturnType,
} from './typing' } from './typing'
import { import { ref, getCurrentInstance, unref, reactive, watchEffect, nextTick, toRaw, computed } from 'vue'
ref,
getCurrentInstance,
unref,
reactive,
watchEffect,
nextTick,
toRaw,
computed,
} from 'vue'
import { isProdMode } from '/@/utils/env' import { isProdMode } from '/@/utils/env'
import { isFunction } from '/@/utils/is' import { isFunction } from '/@/utils/is'
import { tryOnUnmounted } from '@vueuse/core' import { tryOnUnmounted } from '@vueuse/core'
...@@ -103,9 +94,7 @@ export const useDrawerInner = (callbackFn?: Fn): UseDrawerInnerReturnType => { ...@@ -103,9 +94,7 @@ export const useDrawerInner = (callbackFn?: Fn): UseDrawerInnerReturnType => {
const uidRef = ref<string>('') const uidRef = ref<string>('')
if (!getCurrentInstance()) { if (!getCurrentInstance()) {
throw new Error( throw new Error('useDrawerInner() can only be used inside setup() or functional components!')
'useDrawerInner() can only be used inside setup() or functional components!',
)
} }
const getInstance = () => { const getInstance = () => {
......
...@@ -6,15 +6,8 @@ ...@@ -6,15 +6,8 @@
<template #overlay> <template #overlay>
<a-menu :selectedKeys="selectedKeys"> <a-menu :selectedKeys="selectedKeys">
<template v-for="item in dropMenuList" :key="`${item.event}`"> <template v-for="item in dropMenuList" :key="`${item.event}`">
<a-menu-item <a-menu-item v-bind="getAttr(item.event)" @click="handleClickMenu(item)" :disabled="item.disabled">
v-bind="getAttr(item.event)" <a-popconfirm v-if="popconfirm && item.popConfirm" v-bind="getPopConfirmAttrs(item.popConfirm)">
@click="handleClickMenu(item)"
:disabled="item.disabled"
>
<a-popconfirm
v-if="popconfirm && item.popConfirm"
v-bind="getPopConfirmAttrs(item.popConfirm)"
>
<template #icon v-if="item.popConfirm.icon"> <template #icon v-if="item.popConfirm.icon">
<Icon :icon="item.popConfirm.icon" /> <Icon :icon="item.popConfirm.icon" />
</template> </template>
...@@ -84,10 +77,8 @@ ...@@ -84,10 +77,8 @@
const getPopConfirmAttrs = computed(() => { const getPopConfirmAttrs = computed(() => {
return (attrs) => { return (attrs) => {
const originAttrs = omit(attrs, ['confirm', 'cancel', 'icon']) const originAttrs = omit(attrs, ['confirm', 'cancel', 'icon'])
if (!attrs.onConfirm && attrs.confirm && isFunction(attrs.confirm)) if (!attrs.onConfirm && attrs.confirm && isFunction(attrs.confirm)) originAttrs['onConfirm'] = attrs.confirm
originAttrs['onConfirm'] = attrs.confirm if (!attrs.onCancel && attrs.cancel && isFunction(attrs.cancel)) originAttrs['onCancel'] = attrs.cancel
if (!attrs.onCancel && attrs.cancel && isFunction(attrs.cancel))
originAttrs['onCancel'] = attrs.cancel
return originAttrs return originAttrs
} }
}) })
......
<template> <template>
<BasicModal <BasicModal v-bind="$attrs" :title="t('component.excel.exportModalTitle')" @ok="handleOk" @register="registerModal">
v-bind="$attrs" <BasicForm :labelWidth="100" :schemas="schemas" :showActionButtonGroup="false" @register="registerForm" />
:title="t('component.excel.exportModalTitle')"
@ok="handleOk"
@register="registerModal"
>
<BasicForm
:labelWidth="100"
:schemas="schemas"
:showActionButtonGroup="false"
@register="registerForm"
/>
</BasicModal> </BasicModal>
</template> </template>
<script lang="ts"> <script lang="ts">
......
<template> <template>
<div> <div>
<input <input ref="inputRef" type="file" v-show="false" accept=".xlsx, .xls" @change="handleInputClick" />
ref="inputRef"
type="file"
v-show="false"
accept=".xlsx, .xls"
@change="handleInputClick"
/>
<div @click="handleUpload"> <div @click="handleUpload">
<slot></slot> <slot></slot>
</div> </div>
......
...@@ -3,15 +3,8 @@ ...@@ -3,15 +3,8 @@
<template v-for="item in toolbarItemList" :key="item.type"> <template v-for="item in toolbarItemList" :key="item.type">
<Tooltip placement="bottom" v-bind="item.disabled ? { visible: false } : {}"> <Tooltip placement="bottom" v-bind="item.disabled ? { visible: false } : {}">
<template #title>{{ item.tooltip }}</template> <template #title>{{ item.tooltip }}</template>
<span <span :class="`${prefixCls}-toolbar__icon`" v-if="item.icon" @click="onControl(item)">
:class="`${prefixCls}-toolbar__icon`" <Icon :icon="item.icon" :class="item.disabled ? 'cursor-not-allowed disabeld' : 'cursor-pointer'" />
v-if="item.icon"
@click="onControl(item)"
>
<Icon
:icon="item.icon"
:class="item.disabled ? 'cursor-not-allowed disabeld' : 'cursor-pointer'"
/>
</span> </span>
</Tooltip> </Tooltip>
<Divider v-if="item.separate" type="vertical" /> <Divider v-if="item.separate" type="vertical" />
......
...@@ -41,16 +41,7 @@ ...@@ -41,16 +41,7 @@
import type { AdvanceState } from './types/hooks' import type { AdvanceState } from './types/hooks'
import type { Ref } from 'vue' import type { Ref } from 'vue'
import { import { defineComponent, reactive, ref, computed, unref, onMounted, watch, nextTick } from 'vue'
defineComponent,
reactive,
ref,
computed,
unref,
onMounted,
watch,
nextTick,
} from 'vue'
import { Form, Row } from 'ant-design-vue' import { Form, Row } from 'ant-design-vue'
import FormItem from './components/FormItem.vue' import FormItem from './components/FormItem.vue'
import FormAction from './components/FormAction.vue' import FormAction from './components/FormAction.vue'
...@@ -119,9 +110,7 @@ ...@@ -119,9 +110,7 @@
} }
}) })
const getBindValue = computed( const getBindValue = computed(() => ({ ...attrs, ...props, ...unref(getProps) } as Recordable))
() => ({ ...attrs, ...props, ...unref(getProps) } as Recordable),
)
const getSchema = computed((): FormSchema[] => { const getSchema = computed((): FormSchema[] => {
const schemas: FormSchema[] = unref(schemaRef) || (unref(getProps).schemas as any) const schemas: FormSchema[] = unref(schemaRef) || (unref(getProps).schemas as any)
...@@ -141,9 +130,7 @@ ...@@ -141,9 +130,7 @@
} }
} }
if (unref(getProps).showAdvancedButton) { if (unref(getProps).showAdvancedButton) {
return schemas.filter( return schemas.filter((schema) => schema.component !== 'Divider') as FormSchema[]
(schema) => schema.component !== 'Divider',
) as FormSchema[]
} else { } else {
return schemas as FormSchema[] return schemas as FormSchema[]
} }
...@@ -303,9 +290,7 @@ ...@@ -303,9 +290,7 @@
formActionType: formActionType as any, formActionType: formActionType as any,
setFormModel, setFormModel,
getFormClass, getFormClass,
getFormActionBindProps: computed( getFormActionBindProps: computed((): Recordable => ({ ...getProps.value, ...advanceState })),
(): Recordable => ({ ...getProps.value, ...advanceState }),
),
...formActionType, ...formActionType,
} }
}, },
......
...@@ -25,12 +25,7 @@ ...@@ -25,12 +25,7 @@
</Button> </Button>
<slot name="advanceBefore"></slot> <slot name="advanceBefore"></slot>
<Button <Button type="link" size="small" @click="toggleAdvanced" v-if="showAdvancedButton && !hideAdvanceBtn">
type="link"
size="small"
@click="toggleAdvanced"
v-if="showAdvancedButton && !hideAdvanceBtn"
>
{{ isAdvanced ? t('component.form.putAway') : t('component.form.unfold') }} {{ isAdvanced ? t('component.form.putAway') : t('component.form.unfold') }}
<BasicArrow class="ml-1" :expand="!isAdvanced" up /> <BasicArrow class="ml-1" :expand="!isAdvanced" up />
</Button> </Button>
...@@ -88,9 +83,7 @@ ...@@ -88,9 +83,7 @@
const actionColOpt = computed(() => { const actionColOpt = computed(() => {
const { showAdvancedButton, actionSpan: span, actionColOptions } = props const { showAdvancedButton, actionSpan: span, actionColOptions } = props
const actionSpan = 24 - span const actionSpan = 24 - span
const advancedSpanObj = showAdvancedButton const advancedSpanObj = showAdvancedButton ? { span: actionSpan < 6 ? 24 : actionSpan } : {}
? { span: actionSpan < 6 ? 24 : actionSpan }
: {}
const actionColOpt: Partial<ColEx> = { const actionColOpt: Partial<ColEx> = {
style: { textAlign: 'right' }, style: { textAlign: 'right' },
span: showAdvancedButton ? 6 : 4, span: showAdvancedButton ? 6 : 4,
......
...@@ -75,8 +75,7 @@ ...@@ -75,8 +75,7 @@
const { schema, tableAction, formModel, formActionType } = props const { schema, tableAction, formModel, formActionType } = props
let { componentProps = {} } = schema let { componentProps = {} } = schema
if (isFunction(componentProps)) { if (isFunction(componentProps)) {
componentProps = componentProps = componentProps({ schema, tableAction, formModel, formActionType }) ?? {}
componentProps({ schema, tableAction, formModel, formActionType }) ?? {}
} }
if (schema.component === 'Divider') { if (schema.component === 'Divider') {
componentProps = Object.assign({ type: 'horizontal' }, componentProps, { componentProps = Object.assign({ type: 'horizontal' }, componentProps, {
...@@ -219,13 +218,7 @@ ...@@ -219,13 +218,7 @@
} }
function renderComponent() { function renderComponent() {
const { const { renderComponentContent, component, field, changeEvent = 'change', valueField } = props.schema
renderComponentContent,
component,
field,
changeEvent = 'change',
valueField,
} = props.schema
const isCheck = component && ['Switch', 'Checkbox'].includes(component) const isCheck = component && ['Switch', 'Checkbox'].includes(component)
...@@ -257,8 +250,7 @@ ...@@ -257,8 +250,7 @@
// RangePicker place is an array // RangePicker place is an array
if (isCreatePlaceholder && component !== 'RangePicker' && component) { if (isCreatePlaceholder && component !== 'RangePicker' && component) {
propsData.placeholder = propsData.placeholder =
unref(getComponentsProps)?.placeholder || unref(getComponentsProps)?.placeholder || createPlaceholderMessage(component)
createPlaceholderMessage(component)
} }
propsData.codeField = field propsData.codeField = field
propsData.formValues = unref(getValues) propsData.formValues = unref(getValues)
...@@ -293,24 +285,14 @@ ...@@ -293,24 +285,14 @@
) : ( ) : (
label label
) )
const getHelpMessage = isFunction(helpMessage) const getHelpMessage = isFunction(helpMessage) ? helpMessage(unref(getValues)) : helpMessage
? helpMessage(unref(getValues)) if (!getHelpMessage || (Array.isArray(getHelpMessage) && getHelpMessage.length === 0)) {
: helpMessage
if (
!getHelpMessage ||
(Array.isArray(getHelpMessage) && getHelpMessage.length === 0)
) {
return renderLabel return renderLabel
} }
return ( return (
<span> <span>
{renderLabel} {renderLabel}
<BasicHelp <BasicHelp placement="top" class="mx-1" text={getHelpMessage} {...helpComponentProps} />
placement="top"
class="mx-1"
text={getHelpMessage}
{...helpComponentProps}
/>
</span> </span>
) )
} }
...@@ -323,9 +305,7 @@ ...@@ -323,9 +305,7 @@
if (component === 'Divider') { if (component === 'Divider') {
return ( return (
<Col span={24}> <Col span={24}>
<Divider {...unref(getComponentsProps)}> <Divider {...unref(getComponentsProps)}>{renderLabelHelpMessage()}</Divider>
{renderLabelHelpMessage()}
</Divider>
</Col> </Col>
) )
} else { } else {
......
...@@ -35,11 +35,7 @@ function genType() { ...@@ -35,11 +35,7 @@ function genType() {
return [...DATE_TYPE, 'RangePicker'] return [...DATE_TYPE, 'RangePicker']
} }
export function setComponentRuleType( export function setComponentRuleType(rule: ValidationRule, component: ComponentType, valueFormat: string) {
rule: ValidationRule,
component: ComponentType,
valueFormat: string,
) {
if (['DatePicker', 'MonthPicker', 'WeekPicker', 'TimePicker'].includes(component)) { if (['DatePicker', 'MonthPicker', 'WeekPicker', 'TimePicker'].includes(component)) {
rule.type = valueFormat ? 'string' : 'object' rule.type = valueFormat ? 'string' : 'object'
} else if (['RangePicker', 'Upload', 'CheckboxGroup', 'TimePicker'].includes(component)) { } else if (['RangePicker', 'Upload', 'CheckboxGroup', 'TimePicker'].includes(component)) {
......
...@@ -18,14 +18,7 @@ interface UseAdvancedContext { ...@@ -18,14 +18,7 @@ interface UseAdvancedContext {
defaultValueRef: Ref<Recordable> defaultValueRef: Ref<Recordable>
} }
export default function ({ export default function ({ advanceState, emit, getProps, getSchema, formModel, defaultValueRef }: UseAdvancedContext) {
advanceState,
emit,
getProps,
getSchema,
formModel,
defaultValueRef,
}: UseAdvancedContext) {
const { realWidthRef, screenEnum, screenRef } = useBreakpoint() const { realWidthRef, screenEnum, screenRef } = useBreakpoint()
const getEmptySpan = computed((): number => { const getEmptySpan = computed((): number => {
...@@ -137,10 +130,7 @@ export default function ({ ...@@ -137,10 +130,7 @@ export default function ({
} }
if (isShow && (colProps || baseColProps)) { if (isShow && (colProps || baseColProps)) {
const { itemColSum: sum, isAdvanced } = getAdvanced( const { itemColSum: sum, isAdvanced } = getAdvanced({ ...baseColProps, ...colProps }, itemColSum)
{ ...baseColProps, ...colProps },
itemColSum,
)
itemColSum = sum || 0 itemColSum = sum || 0
if (isAdvanced) { if (isAdvanced) {
......
...@@ -9,12 +9,7 @@ interface UseAutoFocusContext { ...@@ -9,12 +9,7 @@ interface UseAutoFocusContext {
isInitedDefault: Ref<boolean> isInitedDefault: Ref<boolean>
formElRef: Ref<FormActionType> formElRef: Ref<FormActionType>
} }
export async function useAutoFocus({ export async function useAutoFocus({ getSchema, getProps, formElRef, isInitedDefault }: UseAutoFocusContext) {
getSchema,
getProps,
formElRef,
isInitedDefault,
}: UseAutoFocusContext) {
watchEffect(async () => { watchEffect(async () => {
if (unref(isInitedDefault) || !unref(getProps).autoFocusFirstItem) { if (unref(isInitedDefault) || !unref(getProps).autoFocusFirstItem) {
return return
......
...@@ -93,11 +93,7 @@ export function useForm(props?: Props): UseFormReturnType { ...@@ -93,11 +93,7 @@ export function useForm(props?: Props): UseFormReturnType {
form.setFieldsValue<T>(values) form.setFieldsValue<T>(values)
}, },
appendSchemaByField: async ( appendSchemaByField: async (schema: FormSchema, prefixField: string | undefined, first: boolean) => {
schema: FormSchema,
prefixField: string | undefined,
first: boolean,
) => {
const form = await getForm() const form = await getForm()
form.appendSchemaByField(schema, prefixField, first) form.appendSchemaByField(schema, prefixField, first)
}, },
......
...@@ -79,11 +79,7 @@ export function useFormEvents({ ...@@ -79,11 +79,7 @@ export function useFormEvents({
if (typeof componentProps === 'function') { if (typeof componentProps === 'function') {
_props = _props({ formModel }) _props = _props({ formModel })
} }
formModel[key] = value formModel[key] = value ? (_props?.valueFormat ? value : dateUtil(value)) : null
? _props?.valueFormat
? value
: dateUtil(value)
: null
} }
} else { } else {
formModel[key] = value formModel[key] = value
...@@ -161,9 +157,7 @@ export function useFormEvents({ ...@@ -161,9 +157,7 @@ export function useFormEvents({
) )
if (!hasField) { if (!hasField) {
error( error('All children of the form Schema array that need to be updated must contain the `field` field')
'All children of the form Schema array that need to be updated must contain the `field` field',
)
return return
} }
schemaRef.value = updateData as FormSchema[] schemaRef.value = updateData as FormSchema[]
...@@ -183,9 +177,7 @@ export function useFormEvents({ ...@@ -183,9 +177,7 @@ export function useFormEvents({
) )
if (!hasField) { if (!hasField) {
error( error('All children of the form Schema array that need to be updated must contain the `field` field')
'All children of the form Schema array that need to be updated must contain the `field` field',
)
return return
} }
const schema: FormSchema[] = [] const schema: FormSchema[] = []
......
...@@ -48,12 +48,7 @@ function tryDeconstructObject(key: string, value: any, target: Recordable) { ...@@ -48,12 +48,7 @@ function tryDeconstructObject(key: string, value: any, target: Recordable) {
} }
} }
export function useFormValues({ export function useFormValues({ defaultValueRef, getSchema, formModel, getProps }: UseFormValuesContext) {
defaultValueRef,
getSchema,
formModel,
getProps,
}: UseFormValuesContext) {
// Processing form values // Processing form values
function handleFormValues(values: Recordable) { function handleFormValues(values: Recordable) {
if (!isObject(values)) { if (!isObject(values)) {
......
...@@ -135,10 +135,7 @@ export interface FormSchema { ...@@ -135,10 +135,7 @@ export interface FormSchema {
// Auxiliary text // Auxiliary text
subLabel?: string subLabel?: string
// Help text on the right side of the text // Help text on the right side of the text
helpMessage?: helpMessage?: string | string[] | ((renderCallbackParams: RenderCallbackParams) => string | string[])
| string
| string[]
| ((renderCallbackParams: RenderCallbackParams) => string | string[])
// BaseHelp component props // BaseHelp component props
helpComponentProps?: Partial<HelpComponentProps> helpComponentProps?: Partial<HelpComponentProps>
// Label width, if it is passed, the labelCol and WrapperCol configured by itemProps will be invalid // Label width, if it is passed, the labelCol and WrapperCol configured by itemProps will be invalid
...@@ -189,11 +186,7 @@ export interface FormSchema { ...@@ -189,11 +186,7 @@ export interface FormSchema {
// Rendering col content requires outer wrapper form-item // Rendering col content requires outer wrapper form-item
renderColContent?: (renderCallbackParams: RenderCallbackParams) => VNode | VNode[] | string renderColContent?: (renderCallbackParams: RenderCallbackParams) => VNode | VNode[] | string
renderComponentContent?: renderComponentContent?: ((renderCallbackParams: RenderCallbackParams) => any) | VNode | VNode[] | string
| ((renderCallbackParams: RenderCallbackParams) => any)
| VNode
| VNode[]
| string
// Custom slot, in from-item // Custom slot, in from-item
slot?: string slot?: string
......
<template> <template>
<SvgIcon <SvgIcon :size="size" :name="getSvgIcon" v-if="isSvgIcon" :class="[$attrs.class, 'anticon']" :spin="spin" />
:size="size"
:name="getSvgIcon"
v-if="isSvgIcon"
:class="[$attrs.class, 'anticon']"
:spin="spin"
/>
<span <span
v-else v-else
ref="elRef" ref="elRef"
...@@ -15,16 +9,7 @@ ...@@ -15,16 +9,7 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import type { PropType } from 'vue' import type { PropType } from 'vue'
import { import { defineComponent, ref, watch, onMounted, nextTick, unref, computed, CSSProperties } from 'vue'
defineComponent,
ref,
watch,
onMounted,
nextTick,
unref,
computed,
CSSProperties,
} from 'vue'
import SvgIcon from './SvgIcon.vue' import SvgIcon from './SvgIcon.vue'
import Iconify from '@purge-icons/generated' import Iconify from '@purge-icons/generated'
import { isString } from '/@/utils/is' import { isString } from '/@/utils/is'
...@@ -52,9 +37,7 @@ ...@@ -52,9 +37,7 @@
const isSvgIcon = computed(() => props.icon?.endsWith(SVG_END_WITH_FLAG)) const isSvgIcon = computed(() => props.icon?.endsWith(SVG_END_WITH_FLAG))
const getSvgIcon = computed(() => props.icon.replace(SVG_END_WITH_FLAG, '')) const getSvgIcon = computed(() => props.icon.replace(SVG_END_WITH_FLAG, ''))
const getIconRef = computed( const getIconRef = computed(() => `${props.prefix ? props.prefix + ':' : ''}${props.icon}`)
() => `${props.prefix ? props.prefix + ':' : ''}${props.icon}`,
)
const update = async () => { const update = async () => {
if (unref(isSvgIcon)) return if (unref(isSvgIcon)) return
......
...@@ -41,10 +41,7 @@ ...@@ -41,10 +41,7 @@
</li> </li>
</ul> </ul>
</ScrollContainer> </ScrollContainer>
<div <div class="flex py-2 items-center justify-center" v-if="getTotal >= pageSize">
class="flex py-2 items-center justify-center"
v-if="getTotal >= pageSize"
>
<a-pagination <a-pagination
showLessItems showLessItems
size="small" size="small"
...@@ -59,17 +56,10 @@ ...@@ -59,17 +56,10 @@
</template> </template>
</template> </template>
<span <span class="cursor-pointer px-2 py-1 flex items-center" v-if="isSvgMode && currentSelect">
class="cursor-pointer px-2 py-1 flex items-center"
v-if="isSvgMode && currentSelect"
>
<SvgIcon :name="currentSelect" /> <SvgIcon :name="currentSelect" />
</span> </span>
<Icon <Icon :icon="currentSelect || 'ion:apps-outline'" class="cursor-pointer px-2 py-1" v-else />
:icon="currentSelect || 'ion:apps-outline'"
class="cursor-pointer px-2 py-1"
v-else
/>
</a-popover> </a-popover>
</template> </template>
</a-input> </a-input>
...@@ -137,10 +127,7 @@ ...@@ -137,10 +127,7 @@
const { clipboardRef, isSuccessRef } = useCopyToClipboard(props.value) const { clipboardRef, isSuccessRef } = useCopyToClipboard(props.value)
const { createMessage } = useMessage() const { createMessage } = useMessage()
const { getPaginationList, getTotal, setCurrentPage } = usePagination( const { getPaginationList, getTotal, setCurrentPage } = usePagination(currentList, props.pageSize)
currentList,
props.pageSize,
)
watchEffect(() => { watchEffect(() => {
currentSelect.value = props.value currentSelect.value = props.value
......
<template> <template>
<svg <svg :class="[prefixCls, $attrs.class, spin && 'svg-icon-spin']" :style="getStyle" aria-hidden="true">
:class="[prefixCls, $attrs.class, spin && 'svg-icon-spin']"
:style="getStyle"
aria-hidden="true"
>
<use :xlink:href="symbolId" /> <use :xlink:href="symbolId" />
</svg> </svg>
</template> </template>
......
...@@ -15,9 +15,7 @@ interface Fn { ...@@ -15,9 +15,7 @@ interface Fn {
export function useLoading(props: Partial<LoadingProps>): [Fn, Fn, (string) => void] export function useLoading(props: Partial<LoadingProps>): [Fn, Fn, (string) => void]
export function useLoading(opt: Partial<UseLoadingOptions>): [Fn, Fn, (string) => void] export function useLoading(opt: Partial<UseLoadingOptions>): [Fn, Fn, (string) => void]
export function useLoading( export function useLoading(opt: Partial<LoadingProps> | Partial<UseLoadingOptions>): [Fn, Fn, (string) => void] {
opt: Partial<LoadingProps> | Partial<UseLoadingOptions>,
): [Fn, Fn, (string) => void] {
let props: Partial<LoadingProps> let props: Partial<LoadingProps>
let target: HTMLElement | Ref<ElRef> = document.body let target: HTMLElement | Ref<ElRef> = document.body
......
...@@ -3,16 +3,7 @@ ...@@ -3,16 +3,7 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import type { Ref } from 'vue' import type { Ref } from 'vue'
import { import { defineComponent, ref, unref, nextTick, computed, watch, onBeforeUnmount, onDeactivated } from 'vue'
defineComponent,
ref,
unref,
nextTick,
computed,
watch,
onBeforeUnmount,
onDeactivated,
} from 'vue'
import Vditor from 'vditor' import Vditor from 'vditor'
import 'vditor/dist/index.css' import 'vditor/dist/index.css'
import { useLocale } from '/@/locales/useLocale' import { useLocale } from '/@/locales/useLocale'
......
...@@ -60,12 +60,7 @@ ...@@ -60,12 +60,7 @@
const { currentRoute } = useRouter() const { currentRoute } = useRouter()
const { handleOpenChange, setOpenKeys, getOpenKeys } = useOpenKeys( const { handleOpenChange, setOpenKeys, getOpenKeys } = useOpenKeys(menuState, items, mode as any, accordion)
menuState,
items,
mode as any,
accordion,
)
const getIsTopMenu = computed(() => { const getIsTopMenu = computed(() => {
const { type, mode } = props const { type, mode } = props
...@@ -77,8 +72,7 @@ ...@@ -77,8 +72,7 @@
}) })
const getMenuClass = computed(() => { const getMenuClass = computed(() => {
const align = const align = props.isHorizontal && unref(getSplit) ? 'start' : unref(getTopMenuAlign)
props.isHorizontal && unref(getSplit) ? 'start' : unref(getTopMenuAlign)
return [ return [
prefixCls, prefixCls,
`justify-${align}`, `justify-${align}`,
...@@ -94,9 +88,7 @@ ...@@ -94,9 +88,7 @@
const inlineCollapseOptions: { inlineCollapsed?: boolean } = {} const inlineCollapseOptions: { inlineCollapsed?: boolean } = {}
if (isInline) { if (isInline) {
inlineCollapseOptions.inlineCollapsed = props.mixSider inlineCollapseOptions.inlineCollapsed = props.mixSider ? false : unref(getCollapsed)
? false
: unref(getCollapsed)
} }
return inlineCollapseOptions return inlineCollapseOptions
}) })
...@@ -138,8 +130,7 @@ ...@@ -138,8 +130,7 @@
return return
} }
const path = const path =
(route || unref(currentRoute)).meta?.currentActiveMenu || (route || unref(currentRoute)).meta?.currentActiveMenu || (route || unref(currentRoute)).path
(route || unref(currentRoute)).path
setOpenKeys(path) setOpenKeys(path)
if (unref(currentActiveMenu)) return if (unref(currentActiveMenu)) return
if (props.isHorizontal && unref(getSplit)) { if (props.isHorizontal && unref(getSplit)) {
......
<template> <template>
<span :class="`${prefixCls}- flex items-center `"> <span :class="`${prefixCls}- flex items-center `">
<Icon <Icon v-if="getIcon" :icon="getIcon" :size="18" :class="`${prefixCls}-wrapper__icon mr-2`" />
v-if="getIcon"
:icon="getIcon"
:size="18"
:class="`${prefixCls}-wrapper__icon mr-2`"
/>
{{ getI18nName }} {{ getI18nName }}
</span> </span>
</template> </template>
......
...@@ -31,10 +31,7 @@ export function useOpenKeys( ...@@ -31,10 +31,7 @@ export function useOpenKeys(
return return
} }
if (!unref(accordion)) { if (!unref(accordion)) {
menuState.openKeys = uniq([ menuState.openKeys = uniq([...menuState.openKeys, ...getAllParentPath(menuList, path)])
...menuState.openKeys,
...getAllParentPath(menuList, path),
])
} else { } else {
menuState.openKeys = getAllParentPath(menuList, path) menuState.openKeys = getAllParentPath(menuList, path)
} }
...@@ -59,11 +56,7 @@ export function useOpenKeys( ...@@ -59,11 +56,7 @@ export function useOpenKeys(
} }
function handleOpenChange(openKeys: string[]) { function handleOpenChange(openKeys: string[]) {
if ( if (unref(mode) === MenuModeEnum.HORIZONTAL || !unref(accordion) || unref(getIsMixSidebar)) {
unref(mode) === MenuModeEnum.HORIZONTAL ||
!unref(accordion) ||
unref(getIsMixSidebar)
) {
menuState.openKeys = openKeys menuState.openKeys = openKeys
} else { } else {
// const menuList = toRaw(menus.value); // const menuList = toRaw(menus.value);
......
...@@ -51,17 +51,7 @@ ...@@ -51,17 +51,7 @@
<script lang="ts"> <script lang="ts">
import type { ModalProps, ModalMethods } from './typing' import type { ModalProps, ModalMethods } from './typing'
import { import { defineComponent, computed, ref, watch, unref, watchEffect, toRef, getCurrentInstance, nextTick } from 'vue'
defineComponent,
computed,
ref,
watch,
unref,
watchEffect,
toRef,
getCurrentInstance,
nextTick,
} from 'vue'
import Modal from './components/Modal' import Modal from './components/Modal'
import ModalWrapper from './components/ModalWrapper.vue' import ModalWrapper from './components/ModalWrapper.vue'
import ModalClose from './components/ModalClose.vue' import ModalClose from './components/ModalClose.vue'
...@@ -178,8 +168,7 @@ ...@@ -178,8 +168,7 @@
async function handleCancel(e: Event) { async function handleCancel(e: Event) {
e?.stopPropagation() e?.stopPropagation()
// 过滤自定义关闭按钮的空白区域 // 过滤自定义关闭按钮的空白区域
if ((e.target as HTMLElement)?.classList?.contains(prefixCls + '-close--custom')) if ((e.target as HTMLElement)?.classList?.contains(prefixCls + '-close--custom')) return
return
if (props.closeFunc && isFunction(props.closeFunc)) { if (props.closeFunc && isFunction(props.closeFunc)) {
const isClose: boolean = await props.closeFunc() const isClose: boolean = await props.closeFunc()
visibleRef.value = !isClose visibleRef.value = !isClose
......
...@@ -15,11 +15,7 @@ ...@@ -15,11 +15,7 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, computed } from 'vue' import { defineComponent, computed } from 'vue'
import { import { FullscreenExitOutlined, FullscreenOutlined, CloseOutlined } from '@ant-design/icons-vue'
FullscreenExitOutlined,
FullscreenOutlined,
CloseOutlined,
} from '@ant-design/icons-vue'
import { useDesign } from '/@/hooks/web/useDesign' import { useDesign } from '/@/hooks/web/useDesign'
import { Tooltip } from 'ant-design-vue' import { Tooltip } from 'ant-design-vue'
import { useI18n } from '/@/hooks/web/useI18n' import { useI18n } from '/@/hooks/web/useI18n'
......
...@@ -5,13 +5,7 @@ ...@@ -5,13 +5,7 @@
{{ cancelText }} {{ cancelText }}
</a-button> </a-button>
<slot name="centerFooter"></slot> <slot name="centerFooter"></slot>
<a-button <a-button :type="okType" @click="handleOk" :loading="confirmLoading" v-bind="okButtonProps" v-if="showOkBtn">
:type="okType"
@click="handleOk"
:loading="confirmLoading"
v-bind="okButtonProps"
v-if="showOkBtn"
>
{{ okText }} {{ okText }}
</a-button> </a-button>
<slot name="appendFooter"></slot> <slot name="appendFooter"></slot>
......
...@@ -7,17 +7,7 @@ ...@@ -7,17 +7,7 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import type { CSSProperties } from 'vue' import type { CSSProperties } from 'vue'
import { import { defineComponent, computed, ref, watchEffect, unref, watch, onMounted, nextTick, onUnmounted } from 'vue'
defineComponent,
computed,
ref,
watchEffect,
unref,
watch,
onMounted,
nextTick,
onUnmounted,
} from 'vue'
import { useWindowSizeFn } from '/@/hooks/event/useWindowSizeFn' import { useWindowSizeFn } from '/@/hooks/event/useWindowSizeFn'
import { ScrollContainer } from '/@/components/Container' import { ScrollContainer } from '/@/components/Container'
import { createModalContext } from '../hooks/useModalContext' import { createModalContext } from '../hooks/useModalContext'
...@@ -149,10 +139,7 @@ ...@@ -149,10 +139,7 @@
if (props.fullScreen) { if (props.fullScreen) {
realHeightRef.value = realHeightRef.value =
window.innerHeight - window.innerHeight - props.modalFooterHeight - props.modalHeaderHeight - 28
props.modalFooterHeight -
props.modalHeaderHeight -
28
} else { } else {
realHeightRef.value = props.height realHeightRef.value = props.height
? props.height ? props.height
......
import type { import type { UseModalReturnType, ModalMethods, ModalProps, ReturnMethods, UseModalInnerReturnType } from '../typing'
UseModalReturnType, import { ref, onUnmounted, unref, getCurrentInstance, reactive, watchEffect, nextTick, toRaw } from 'vue'
ModalMethods,
ModalProps,
ReturnMethods,
UseModalInnerReturnType,
} from '../typing'
import {
ref,
onUnmounted,
unref,
getCurrentInstance,
reactive,
watchEffect,
nextTick,
toRaw,
} from 'vue'
import { isProdMode } from '/@/utils/env' import { isProdMode } from '/@/utils/env'
import { isFunction } from '/@/utils/is' import { isFunction } from '/@/utils/is'
import { isEqual } from 'lodash-es' import { isEqual } from 'lodash-es'
......
...@@ -39,8 +39,7 @@ ...@@ -39,8 +39,7 @@
line-height: 44px; line-height: 44px;
background-color: @component-background; background-color: @component-background;
border-top: 1px solid @border-color-base; border-top: 1px solid @border-color-base;
box-shadow: 0 -6px 16px -8px rgb(0 0 0 / 8%), 0 -9px 28px 0 rgb(0 0 0 / 5%), box-shadow: 0 -6px 16px -8px rgb(0 0 0 / 8%), 0 -9px 28px 0 rgb(0 0 0 / 5%), 0 -12px 48px 16px rgb(0 0 0 / 3%);
0 -12px 48px 16px rgb(0 0 0 / 3%);
transition: width 0.2s; transition: width 0.2s;
&__left { &__left {
......
<template> <template>
<div :class="getClass" ref="wrapperRef"> <div :class="getClass" ref="wrapperRef">
<PageHeader <PageHeader :ghost="ghost" :title="title" v-bind="omit($attrs, 'class')" ref="headerRef" v-if="getShowHeader">
:ghost="ghost"
:title="title"
v-bind="omit($attrs, 'class')"
ref="headerRef"
v-if="getShowHeader"
>
<template #default> <template #default>
<template v-if="content"> <template v-if="content">
{{ content }} {{ content }}
...@@ -18,12 +12,7 @@ ...@@ -18,12 +12,7 @@
</template> </template>
</PageHeader> </PageHeader>
<div <div class="overflow-hidden" :class="getContentClass" :style="getContentStyle" ref="contentRef">
class="overflow-hidden"
:class="getContentClass"
:style="getContentStyle"
ref="contentRef"
>
<slot></slot> <slot></slot>
</div> </div>
...@@ -105,19 +94,13 @@ ...@@ -105,19 +94,13 @@
}) })
const getShowHeader = computed( const getShowHeader = computed(
() => () => props.content || slots?.headerContent || props.title || getHeaderSlots.value.length,
props.content ||
slots?.headerContent ||
props.title ||
getHeaderSlots.value.length,
) )
const getShowFooter = computed(() => slots?.leftFooter || slots?.rightFooter) const getShowFooter = computed(() => slots?.leftFooter || slots?.rightFooter)
const getHeaderSlots = computed(() => { const getHeaderSlots = computed(() => {
return Object.keys( return Object.keys(omit(slots, 'default', 'leftFooter', 'rightFooter', 'headerContent'))
omit(slots, 'default', 'leftFooter', 'rightFooter', 'headerContent'),
)
}) })
const getContentStyle = computed((): CSSProperties => { const getContentStyle = computed((): CSSProperties => {
......
...@@ -345,25 +345,16 @@ ...@@ -345,25 +345,16 @@
const renderController = () => { const renderController = () => {
return ( return (
<div class={`${prefixCls}__controller`}> <div class={`${prefixCls}__controller`}>
<div <div class={`${prefixCls}__controller-item`} onClick={() => scaleFunc(-getScaleStep.value)}>
class={`${prefixCls}__controller-item`}
onClick={() => scaleFunc(-getScaleStep.value)}
>
<img src={unScaleSvg} /> <img src={unScaleSvg} />
</div> </div>
<div <div class={`${prefixCls}__controller-item`} onClick={() => scaleFunc(getScaleStep.value)}>
class={`${prefixCls}__controller-item`}
onClick={() => scaleFunc(getScaleStep.value)}
>
<img src={scaleSvg} /> <img src={scaleSvg} />
</div> </div>
<div class={`${prefixCls}__controller-item`} onClick={resume}> <div class={`${prefixCls}__controller-item`} onClick={resume}>
<img src={resumeSvg} /> <img src={resumeSvg} />
</div> </div>
<div <div class={`${prefixCls}__controller-item`} onClick={() => rotateFunc(-90)}>
class={`${prefixCls}__controller-item`}
onClick={() => rotateFunc(-90)}
>
<img src={unRotateSvg} /> <img src={unRotateSvg} />
</div> </div>
<div class={`${prefixCls}__controller-item`} onClick={() => rotateFunc(90)}> <div class={`${prefixCls}__controller-item`} onClick={() => rotateFunc(90)}>
...@@ -378,10 +369,7 @@ ...@@ -378,10 +369,7 @@
return null return null
} }
return ( return (
<div <div class={[`${prefixCls}__arrow`, direction]} onClick={() => handleChange(direction)}>
class={[`${prefixCls}__arrow`, direction]}
onClick={() => handleChange(direction)}
>
{direction === 'left' ? <LeftOutlined /> : <RightOutlined />} {direction === 'left' ? <LeftOutlined /> : <RightOutlined />}
</div> </div>
) )
...@@ -390,12 +378,7 @@ ...@@ -390,12 +378,7 @@
return () => { return () => {
return ( return (
imgState.show && ( imgState.show && (
<div <div class={prefixCls} ref={wrapElRef} onMouseup={handleMouseUp} onClick={handleMaskClick}>
class={prefixCls}
ref={wrapElRef}
onMouseup={handleMouseUp}
onClick={handleMaskClick}
>
<div class={`${prefixCls}-content`}> <div class={`${prefixCls}-content`}>
{/*<Spin*/} {/*<Spin*/}
{/* indicator={<LoadingOutlined style="font-size: 24px" spin />}*/} {/* indicator={<LoadingOutlined style="font-size: 24px" spin />}*/}
...@@ -409,10 +392,7 @@ ...@@ -409,10 +392,7 @@
{/*/>*/} {/*/>*/}
<img <img
style={unref(getImageStyle)} style={unref(getImageStyle)}
class={[ class={[`${prefixCls}-image`, imgState.status === StatueEnum.DONE ? '' : 'hidden']}
`${prefixCls}-image`,
imgState.status === StatueEnum.DONE ? '' : 'hidden',
]}
ref={imgElRef} ref={imgElRef}
src={imgState.currentUrl} src={imgState.currentUrl}
onMousedown={handleAddMoveListener} onMousedown={handleAddMoveListener}
......
...@@ -3,12 +3,7 @@ import type { QRCodeRenderersOptions } from 'qrcode' ...@@ -3,12 +3,7 @@ import type { QRCodeRenderersOptions } from 'qrcode'
import { RenderQrCodeParams, ContentType } from './typing' import { RenderQrCodeParams, ContentType } from './typing'
import { cloneDeep } from 'lodash-es' import { cloneDeep } from 'lodash-es'
export const renderQrCode = ({ export const renderQrCode = ({ canvas, content, width = 0, options: params = {} }: RenderQrCodeParams) => {
canvas,
content,
width = 0,
options: params = {},
}: RenderQrCodeParams) => {
const options = cloneDeep(params) const options = cloneDeep(params)
// 容错率,默认对内容少的二维码采用高容错率,内容多的二维码采用低容错率 // 容错率,默认对内容少的二维码采用高容错率,内容多的二维码采用低容错率
options.errorCorrectionLevel = options.errorCorrectionLevel || getErrorCorrectionLevel(content) options.errorCorrectionLevel = options.errorCorrectionLevel || getErrorCorrectionLevel(content)
......
...@@ -6,12 +6,7 @@ ...@@ -6,12 +6,7 @@
:style="style" :style="style"
@scroll="handleScroll" @scroll="handleScroll"
> >
<component <component :is="tag" ref="resize" :class="['scrollbar__view', viewClass]" :style="viewStyle">
:is="tag"
ref="resize"
:class="['scrollbar__view', viewClass]"
:style="viewStyle"
>
<slot></slot> <slot></slot>
</component> </component>
</div> </div>
...@@ -26,16 +21,7 @@ ...@@ -26,16 +21,7 @@
import componentSetting from '/@/settings/componentSetting' import componentSetting from '/@/settings/componentSetting'
const { scrollbar } = componentSetting const { scrollbar } = componentSetting
import { toObject } from './util' import { toObject } from './util'
import { import { defineComponent, ref, onMounted, onBeforeUnmount, nextTick, provide, computed, unref } from 'vue'
defineComponent,
ref,
onMounted,
onBeforeUnmount,
nextTick,
provide,
computed,
unref,
} from 'vue'
import Bar from './bar' import Bar from './bar'
export default defineComponent({ export default defineComponent({
......
import { import { defineComponent, h, computed, ref, getCurrentInstance, onUnmounted, inject, Ref } from 'vue'
defineComponent,
h,
computed,
ref,
getCurrentInstance,
onUnmounted,
inject,
Ref,
} from 'vue'
import { on, off } from '/@/utils/domUtils' import { on, off } from '/@/utils/domUtils'
import { renderThumbStyle, BAR_MAP } from './util' import { renderThumbStyle, BAR_MAP } from './util'
...@@ -43,15 +34,11 @@ export default defineComponent({ ...@@ -43,15 +34,11 @@ export default defineComponent({
} }
const clickTrackHandler = (e: any) => { const clickTrackHandler = (e: any) => {
const offset = Math.abs( const offset = Math.abs(e.target.getBoundingClientRect()[bar.value.direction] - e[bar.value.client])
e.target.getBoundingClientRect()[bar.value.direction] - e[bar.value.client],
)
const thumbHalf = thumb.value[bar.value.offset] / 2 const thumbHalf = thumb.value[bar.value.offset] / 2
const thumbPositionPercentage = const thumbPositionPercentage = ((offset - thumbHalf) * 100) / instance?.vnode.el?.[bar.value.offset]
((offset - thumbHalf) * 100) / instance?.vnode.el?.[bar.value.offset]
wrap.value[bar.value.scroll] = wrap.value[bar.value.scroll] = (thumbPositionPercentage * wrap.value[bar.value.scrollSize]) / 100
(thumbPositionPercentage * wrap.value[bar.value.scrollSize]) / 100
} }
const startDrag = (e: any) => { const startDrag = (e: any) => {
e.stopImmediatePropagation() e.stopImmediatePropagation()
...@@ -67,15 +54,11 @@ export default defineComponent({ ...@@ -67,15 +54,11 @@ export default defineComponent({
if (!prevPage) return if (!prevPage) return
const offset = const offset = (instance?.vnode.el?.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]) * -1
(instance?.vnode.el?.getBoundingClientRect()[bar.value.direction] -
e[bar.value.client]) *
-1
const thumbClickPosition = thumb.value[bar.value.offset] - prevPage const thumbClickPosition = thumb.value[bar.value.offset] - prevPage
const thumbPositionPercentage = const thumbPositionPercentage =
((offset - thumbClickPosition) * 100) / instance?.vnode.el?.[bar.value.offset] ((offset - thumbClickPosition) * 100) / instance?.vnode.el?.[bar.value.offset]
wrap.value[bar.value.scroll] = wrap.value[bar.value.scroll] = (thumbPositionPercentage * wrap.value[bar.value.scrollSize]) / 100
(thumbPositionPercentage * wrap.value[bar.value.scrollSize]) / 100
} }
function mouseUpDocumentHandler() { function mouseUpDocumentHandler() {
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论