mirror of
https://github.com/vbenjs/vue-vben-admin.git
synced 2025-08-25 08:06:30 +08:00
chore: Extract lint config
This commit is contained in:
74
.eslintrc.js
74
.eslintrc.js
@@ -1,76 +1,4 @@
|
||||
module.exports = {
|
||||
root: true,
|
||||
env: {
|
||||
browser: true,
|
||||
node: true,
|
||||
es6: true,
|
||||
},
|
||||
parser: 'vue-eslint-parser',
|
||||
parserOptions: {
|
||||
parser: '@typescript-eslint/parser',
|
||||
ecmaVersion: 2020,
|
||||
sourceType: 'module',
|
||||
jsxPragma: 'React',
|
||||
ecmaFeatures: {
|
||||
jsx: true,
|
||||
},
|
||||
},
|
||||
extends: [
|
||||
'plugin:vue/vue3-recommended',
|
||||
'plugin:@typescript-eslint/recommended',
|
||||
'plugin:prettier/recommended',
|
||||
],
|
||||
rules: {
|
||||
'vue/script-setup-uses-vars': 'error',
|
||||
'@typescript-eslint/ban-ts-ignore': 'off',
|
||||
'@typescript-eslint/explicit-function-return-type': 'off',
|
||||
'@typescript-eslint/no-explicit-any': 'off',
|
||||
'@typescript-eslint/no-var-requires': 'off',
|
||||
'@typescript-eslint/no-empty-function': 'off',
|
||||
'vue/custom-event-name-casing': 'off',
|
||||
'no-use-before-define': 'off',
|
||||
'@typescript-eslint/no-use-before-define': 'off',
|
||||
'@typescript-eslint/ban-ts-comment': 'off',
|
||||
'@typescript-eslint/ban-types': 'off',
|
||||
'@typescript-eslint/no-non-null-assertion': 'off',
|
||||
'@typescript-eslint/explicit-module-boundary-types': 'off',
|
||||
'@typescript-eslint/no-unused-vars': [
|
||||
'error',
|
||||
{
|
||||
argsIgnorePattern: '^_',
|
||||
varsIgnorePattern: '^_',
|
||||
},
|
||||
],
|
||||
'no-unused-vars': [
|
||||
'error',
|
||||
{
|
||||
argsIgnorePattern: '^_',
|
||||
varsIgnorePattern: '^_',
|
||||
},
|
||||
],
|
||||
'space-before-function-paren': 'off',
|
||||
|
||||
'vue/attributes-order': 'off',
|
||||
'vue/one-component-per-file': 'off',
|
||||
'vue/html-closing-bracket-newline': 'off',
|
||||
'vue/max-attributes-per-line': 'off',
|
||||
'vue/multiline-html-element-content-newline': 'off',
|
||||
'vue/singleline-html-element-content-newline': 'off',
|
||||
'vue/attribute-hyphenation': 'off',
|
||||
'vue/require-default-prop': 'off',
|
||||
'vue/require-explicit-emits': 'off',
|
||||
'vue/html-self-closing': [
|
||||
'error',
|
||||
{
|
||||
html: {
|
||||
void: 'always',
|
||||
normal: 'never',
|
||||
component: 'always',
|
||||
},
|
||||
svg: 'always',
|
||||
math: 'always',
|
||||
},
|
||||
],
|
||||
'vue/multi-word-component-names': 'off',
|
||||
},
|
||||
extends: ['@vben'],
|
||||
};
|
||||
|
7
.github/workflows/deploy.yml
vendored
7
.github/workflows/deploy.yml
vendored
@@ -98,7 +98,7 @@ jobs:
|
||||
|
||||
- name: Build
|
||||
env:
|
||||
NODE_OPTIONS: "--max_old_space_size=4096"
|
||||
NODE_OPTIONS: '--max_old_space_size=4096'
|
||||
run: |
|
||||
yarn install
|
||||
yarn run build
|
||||
@@ -116,8 +116,3 @@ jobs:
|
||||
PUBLISH_BRANCH: gh-pages
|
||||
PUBLISH_DIR: ./dist
|
||||
CNAME: vben.vvbin.cn
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
2
.gitignore
vendored
2
.gitignore
vendored
@@ -1,8 +1,8 @@
|
||||
node_modules
|
||||
.DS_Store
|
||||
dist
|
||||
.npmrc
|
||||
.cache
|
||||
.turbo
|
||||
|
||||
tests/server/static
|
||||
tests/server/static/upload
|
||||
|
@@ -7,4 +7,4 @@
|
||||
PATH="/usr/local/bin:$PATH"
|
||||
|
||||
# Format and submit code according to lintstagedrc.js configuration
|
||||
npm run lint:lint-staged
|
||||
pnpm exec lint-staged
|
||||
|
7
.npmrc
Normal file
7
.npmrc
Normal file
@@ -0,0 +1,7 @@
|
||||
public-hoist-pattern[]=husky
|
||||
public-hoist-pattern[]=*eslint*
|
||||
public-hoist-pattern[]=*prettier*
|
||||
public-hoist-pattern[]=lint-staged
|
||||
public-hoist-pattern[]=*stylelint*
|
||||
public-hoist-pattern[]=@commitlint/cli
|
||||
public-hoist-pattern[]=@vben/eslint-config
|
@@ -1,9 +1,10 @@
|
||||
/dist/*
|
||||
dist
|
||||
.local
|
||||
.output.js
|
||||
/node_modules/**
|
||||
node_modules
|
||||
|
||||
**/*.svg
|
||||
**/*.sh
|
||||
|
||||
/public/*
|
||||
public
|
||||
.npmrc
|
||||
|
@@ -7,4 +7,5 @@ module.exports = {
|
||||
proseWrap: 'never',
|
||||
htmlWhitespaceSensitivity: 'strict',
|
||||
endOfLine: 'auto',
|
||||
plugins: ['prettier-plugin-packagejson'],
|
||||
};
|
||||
|
@@ -1,3 +1,2 @@
|
||||
/dist/*
|
||||
/public/*
|
||||
public/*
|
||||
dist
|
||||
public
|
||||
|
@@ -1,100 +1,4 @@
|
||||
module.exports = {
|
||||
root: true,
|
||||
plugins: ['stylelint-order'],
|
||||
extends: ['stylelint-config-standard'],
|
||||
customSyntax: 'postcss-html',
|
||||
rules: {
|
||||
'function-no-unknown': null,
|
||||
'selector-class-pattern': null,
|
||||
'selector-pseudo-class-no-unknown': [
|
||||
true,
|
||||
{
|
||||
ignorePseudoClasses: ['global', 'deep'],
|
||||
},
|
||||
],
|
||||
'selector-pseudo-element-no-unknown': [
|
||||
true,
|
||||
{
|
||||
ignorePseudoElements: ['v-deep'],
|
||||
},
|
||||
],
|
||||
'at-rule-no-unknown': [
|
||||
true,
|
||||
{
|
||||
ignoreAtRules: [
|
||||
'tailwind',
|
||||
'apply',
|
||||
'variants',
|
||||
'responsive',
|
||||
'screen',
|
||||
'function',
|
||||
'if',
|
||||
'each',
|
||||
'include',
|
||||
'mixin',
|
||||
],
|
||||
},
|
||||
],
|
||||
'no-empty-source': null,
|
||||
'string-quotes': null,
|
||||
'named-grid-areas-no-invalid': null,
|
||||
'unicode-bom': 'never',
|
||||
'no-descending-specificity': null,
|
||||
'font-family-no-missing-generic-family-keyword': null,
|
||||
'declaration-colon-space-after': 'always-single-line',
|
||||
'declaration-colon-space-before': 'never',
|
||||
// 'declaration-block-trailing-semicolon': 'always',
|
||||
'rule-empty-line-before': [
|
||||
'always',
|
||||
{
|
||||
ignore: ['after-comment', 'first-nested'],
|
||||
},
|
||||
],
|
||||
'unit-no-unknown': [true, { ignoreUnits: ['rpx'] }],
|
||||
'order/order': [
|
||||
[
|
||||
'dollar-variables',
|
||||
'custom-properties',
|
||||
'at-rules',
|
||||
'declarations',
|
||||
{
|
||||
type: 'at-rule',
|
||||
name: 'supports',
|
||||
},
|
||||
{
|
||||
type: 'at-rule',
|
||||
name: 'media',
|
||||
},
|
||||
'rules',
|
||||
],
|
||||
{ severity: 'warning' },
|
||||
],
|
||||
},
|
||||
ignoreFiles: ['**/*.js', '**/*.jsx', '**/*.tsx', '**/*.ts'],
|
||||
overrides: [
|
||||
{
|
||||
files: ['*.vue', '**/*.vue', '*.html', '**/*.html'],
|
||||
extends: ['stylelint-config-recommended'],
|
||||
rules: {
|
||||
'keyframes-name-pattern': null,
|
||||
'selector-pseudo-class-no-unknown': [
|
||||
true,
|
||||
{
|
||||
ignorePseudoClasses: ['deep', 'global'],
|
||||
},
|
||||
],
|
||||
'selector-pseudo-element-no-unknown': [
|
||||
true,
|
||||
{
|
||||
ignorePseudoElements: ['v-deep', 'v-global', 'v-slotted'],
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
files: ['*.less', '**/*.less'],
|
||||
customSyntax: 'postcss-less',
|
||||
extends: ['stylelint-config-standard', 'stylelint-config-recommended-vue'],
|
||||
},
|
||||
],
|
||||
extends: ['@vben/stylelint-config'],
|
||||
};
|
||||
|
5
.vscode/settings.json
vendored
5
.vscode/settings.json
vendored
@@ -84,7 +84,8 @@
|
||||
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
||||
},
|
||||
"editor.codeActionsOnSave": {
|
||||
"source.fixAll.eslint": true
|
||||
"source.fixAll.eslint": true,
|
||||
"source.fixAll.stylelint": true
|
||||
},
|
||||
"[vue]": {
|
||||
"editor.codeActionsOnSave": {
|
||||
@@ -165,7 +166,7 @@
|
||||
"*.tsx": "$(capture).test.ts, $(capture).test.tsx",
|
||||
"*.env": "$(capture).env.*",
|
||||
"CHANGELOG.md": "CHANGELOG*",
|
||||
"package.json": "pnpm-lock.yaml,pnpm-workspace.yaml,LICENSE,.gitattributes,.gitignore,.gitpod.yml,CNAME,README*",
|
||||
"package.json": "pnpm-lock.yaml,pnpm-workspace.yaml,LICENSE,.gitattributes,.gitignore,.gitpod.yml,CNAME,README*,.npmrc",
|
||||
".eslintrc.js": ".eslintignore,.prettierignore,.stylelintignore,.commitlintrc.js,.prettierrc.js,.stylelintrc.js"
|
||||
},
|
||||
"terminal.integrated.scrollback": 10000
|
||||
|
@@ -6,7 +6,7 @@ import { viteMockServe } from 'vite-plugin-mock';
|
||||
|
||||
export function configMockPlugin(isBuild: boolean) {
|
||||
return viteMockServe({
|
||||
ignore: /^\_/,
|
||||
ignore: /^_/,
|
||||
mockPath: 'mock',
|
||||
localEnabled: !isBuild,
|
||||
prodEnabled: isBuild,
|
||||
|
60
index.html
60
index.html
@@ -34,39 +34,39 @@
|
||||
|
||||
.app-loading {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
background-color: #f4f7f9;
|
||||
}
|
||||
|
||||
.app-loading .app-loading-wrap {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
display: flex;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
}
|
||||
|
||||
.app-loading .dots {
|
||||
display: flex;
|
||||
padding: 98px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 98px;
|
||||
}
|
||||
|
||||
.app-loading .app-loading-title {
|
||||
display: flex;
|
||||
margin-top: 30px;
|
||||
font-size: 30px;
|
||||
color: rgb(0 0 0 / 85%);
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-top: 30px;
|
||||
color: rgb(0 0 0 / 85%);
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.app-loading .app-loading-logo {
|
||||
@@ -77,28 +77,28 @@
|
||||
}
|
||||
|
||||
.dot {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
margin-top: 30px;
|
||||
font-size: 32px;
|
||||
transform: rotate(45deg);
|
||||
box-sizing: border-box;
|
||||
animation: antRotate 1.2s infinite linear;
|
||||
animation: ant-rotate 1.2s infinite linear;
|
||||
font-size: 32px;
|
||||
}
|
||||
|
||||
.dot i {
|
||||
position: absolute;
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background-color: #0065cc;
|
||||
border-radius: 100%;
|
||||
opacity: 30%;
|
||||
transform: scale(0.75);
|
||||
animation: antSpinMove 1s infinite linear alternate;
|
||||
transform-origin: 50% 50%;
|
||||
animation: ant-spin-move 1s infinite linear alternate;
|
||||
border-radius: 100%;
|
||||
opacity: 0.3;
|
||||
background-color: #0065cc;
|
||||
}
|
||||
|
||||
.dot i:nth-child(1) {
|
||||
@@ -123,24 +123,28 @@
|
||||
left: 0;
|
||||
animation-delay: 1.2s;
|
||||
}
|
||||
@keyframes antRotate {
|
||||
|
||||
@keyframes ant-rotate {
|
||||
to {
|
||||
transform: rotate(405deg);
|
||||
}
|
||||
}
|
||||
@keyframes antRotate {
|
||||
|
||||
@keyframes ant-rotate {
|
||||
to {
|
||||
transform: rotate(405deg);
|
||||
}
|
||||
}
|
||||
@keyframes antSpinMove {
|
||||
|
||||
@keyframes ant-spin-move {
|
||||
to {
|
||||
opacity: 100%;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@keyframes antSpinMove {
|
||||
|
||||
@keyframes ant-spin-move {
|
||||
to {
|
||||
opacity: 100%;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
10
internal/eslint-config/build.config.ts
Normal file
10
internal/eslint-config/build.config.ts
Normal file
@@ -0,0 +1,10 @@
|
||||
import { defineBuildConfig } from 'unbuild';
|
||||
|
||||
export default defineBuildConfig({
|
||||
clean: true,
|
||||
entries: ['src/index'],
|
||||
declaration: true,
|
||||
rollup: {
|
||||
emitCJS: true,
|
||||
},
|
||||
});
|
32
internal/eslint-config/package.json
Normal file
32
internal/eslint-config/package.json
Normal file
@@ -0,0 +1,32 @@
|
||||
{
|
||||
"name": "@vben/eslint-config",
|
||||
"version": "1.0.0",
|
||||
"private": true,
|
||||
"license": "MIT",
|
||||
"exports": {
|
||||
".": {
|
||||
"types": "./dist/index.d.ts",
|
||||
"import": "./dist/index.mjs",
|
||||
"require": "./dist/index.cjs"
|
||||
}
|
||||
},
|
||||
"main": "./dist/index.cjs",
|
||||
"module": "./dist/index.mjs",
|
||||
"types": "./dist/index.d.ts",
|
||||
"files": [
|
||||
"dist"
|
||||
],
|
||||
"scripts": {
|
||||
"clean": "pnpm rimraf .turbo node_modules dist",
|
||||
"stub": "pnpm unbuild --stub"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@typescript-eslint/eslint-plugin": "^5.57.0",
|
||||
"@typescript-eslint/parser": "^5.57.0",
|
||||
"eslint": "^8.37.0",
|
||||
"eslint-config-prettier": "^8.8.0",
|
||||
"eslint-plugin-prettier": "^4.2.1",
|
||||
"eslint-plugin-vue": "^9.10.0",
|
||||
"vue-eslint-parser": "^9.1.1"
|
||||
}
|
||||
}
|
82
internal/eslint-config/src/index.ts
Normal file
82
internal/eslint-config/src/index.ts
Normal file
@@ -0,0 +1,82 @@
|
||||
export default {
|
||||
env: {
|
||||
browser: true,
|
||||
node: true,
|
||||
es6: true,
|
||||
},
|
||||
parser: 'vue-eslint-parser',
|
||||
parserOptions: {
|
||||
parser: '@typescript-eslint/parser',
|
||||
ecmaVersion: 2020,
|
||||
sourceType: 'module',
|
||||
jsxPragma: 'React',
|
||||
ecmaFeatures: {
|
||||
jsx: true,
|
||||
},
|
||||
project: './tsconfig.*?.json',
|
||||
createDefaultProgram: false,
|
||||
extraFileExtensions: ['.vue'],
|
||||
},
|
||||
plugins: ['vue', '@typescript-eslint'],
|
||||
extends: [
|
||||
'eslint:recommended',
|
||||
'plugin:vue/vue3-recommended',
|
||||
'plugin:@typescript-eslint/recommended',
|
||||
'plugin:prettier/recommended',
|
||||
],
|
||||
rules: {
|
||||
'no-case-declarations': 'off',
|
||||
'vue/script-setup-uses-vars': 'error',
|
||||
'vue/no-reserved-component-names': 'off',
|
||||
'@typescript-eslint/ban-ts-ignore': 'off',
|
||||
'@typescript-eslint/explicit-function-return-type': 'off',
|
||||
'@typescript-eslint/no-explicit-any': 'off',
|
||||
'@typescript-eslint/no-var-requires': 'off',
|
||||
'@typescript-eslint/no-empty-function': 'off',
|
||||
'vue/custom-event-name-casing': 'off',
|
||||
'no-use-before-define': 'off',
|
||||
'@typescript-eslint/no-use-before-define': 'off',
|
||||
'@typescript-eslint/ban-ts-comment': 'off',
|
||||
'@typescript-eslint/ban-types': 'off',
|
||||
'@typescript-eslint/no-non-null-assertion': 'off',
|
||||
'@typescript-eslint/explicit-module-boundary-types': 'off',
|
||||
'@typescript-eslint/no-unused-vars': [
|
||||
'error',
|
||||
{
|
||||
argsIgnorePattern: '^_',
|
||||
varsIgnorePattern: '^_',
|
||||
},
|
||||
],
|
||||
'no-unused-vars': [
|
||||
'error',
|
||||
{
|
||||
argsIgnorePattern: '^_',
|
||||
varsIgnorePattern: '^_',
|
||||
},
|
||||
],
|
||||
'space-before-function-paren': 'off',
|
||||
|
||||
'vue/attributes-order': 'off',
|
||||
'vue/one-component-per-file': 'off',
|
||||
'vue/html-closing-bracket-newline': 'off',
|
||||
'vue/max-attributes-per-line': 'off',
|
||||
'vue/multiline-html-element-content-newline': 'off',
|
||||
'vue/singleline-html-element-content-newline': 'off',
|
||||
'vue/attribute-hyphenation': 'off',
|
||||
'vue/require-default-prop': 'off',
|
||||
'vue/require-explicit-emits': 'off',
|
||||
'vue/html-self-closing': [
|
||||
'error',
|
||||
{
|
||||
html: {
|
||||
void: 'always',
|
||||
normal: 'never',
|
||||
component: 'always',
|
||||
},
|
||||
svg: 'always',
|
||||
math: 'always',
|
||||
},
|
||||
],
|
||||
'vue/multi-word-component-names': 'off',
|
||||
},
|
||||
};
|
10
internal/stylelint-config/build.config.ts
Normal file
10
internal/stylelint-config/build.config.ts
Normal file
@@ -0,0 +1,10 @@
|
||||
import { defineBuildConfig } from 'unbuild';
|
||||
|
||||
export default defineBuildConfig({
|
||||
clean: true,
|
||||
entries: ['src/index'],
|
||||
declaration: true,
|
||||
rollup: {
|
||||
emitCJS: true,
|
||||
},
|
||||
});
|
39
internal/stylelint-config/package.json
Normal file
39
internal/stylelint-config/package.json
Normal file
@@ -0,0 +1,39 @@
|
||||
{
|
||||
"name": "@vben/stylelint-config",
|
||||
"version": "1.0.0",
|
||||
"private": true,
|
||||
"license": "MIT",
|
||||
"exports": {
|
||||
".": {
|
||||
"types": "./dist/index.d.ts",
|
||||
"import": "./dist/index.mjs",
|
||||
"require": "./dist/index.cjs"
|
||||
}
|
||||
},
|
||||
"main": "./dist/index.cjs",
|
||||
"module": "./dist/index.mjs",
|
||||
"types": "./dist/index.d.ts",
|
||||
"files": [
|
||||
"dist"
|
||||
],
|
||||
"scripts": {
|
||||
"clean": "pnpm rimraf .turbo node_modules dist",
|
||||
"stub": "pnpm unbuild --stub"
|
||||
},
|
||||
"devDependencies": {
|
||||
"postcss": "^8.4.21",
|
||||
"postcss-html": "^1.5.0",
|
||||
"postcss-less": "^6.0.0",
|
||||
"postcss-scss": "^4.0.6",
|
||||
"prettier": "^2.8.7",
|
||||
"stylelint": "^15.4.0",
|
||||
"stylelint-config-property-sort-order-smacss": "^9.1.0",
|
||||
"stylelint-config-recommended": "^11.0.0",
|
||||
"stylelint-config-recommended-scss": "^9.0.1",
|
||||
"stylelint-config-recommended-vue": "^1.4.0",
|
||||
"stylelint-config-standard": "^32.0.0",
|
||||
"stylelint-config-standard-scss": "^7.0.1",
|
||||
"stylelint-order": "^6.0.3",
|
||||
"stylelint-prettier": "^3.0.0"
|
||||
}
|
||||
}
|
89
internal/stylelint-config/src/index.ts
Normal file
89
internal/stylelint-config/src/index.ts
Normal file
@@ -0,0 +1,89 @@
|
||||
export default {
|
||||
extends: ['stylelint-config-standard', 'stylelint-config-property-sort-order-smacss'],
|
||||
plugins: ['stylelint-order', 'stylelint-prettier'],
|
||||
// customSyntax: 'postcss-html',
|
||||
overrides: [
|
||||
{
|
||||
files: ['**/*.(css|html|vue)'],
|
||||
customSyntax: 'postcss-html',
|
||||
},
|
||||
{
|
||||
files: ['*.less', '**/*.less'],
|
||||
customSyntax: 'postcss-less',
|
||||
extends: ['stylelint-config-standard', 'stylelint-config-recommended-vue'],
|
||||
},
|
||||
{
|
||||
files: ['*.scss', '**/*.scss'],
|
||||
customSyntax: 'postcss-scss',
|
||||
extends: ['stylelint-config-standard-scss', 'stylelint-config-recommended-vue/scss'],
|
||||
rule: {
|
||||
'scss/percent-placeholder-pattern': null,
|
||||
},
|
||||
},
|
||||
],
|
||||
rules: {
|
||||
'function-no-unknown': null,
|
||||
'selector-class-pattern': null,
|
||||
'selector-pseudo-class-no-unknown': [
|
||||
true,
|
||||
{
|
||||
ignorePseudoClasses: ['global', 'deep'],
|
||||
},
|
||||
],
|
||||
'selector-pseudo-element-no-unknown': [
|
||||
true,
|
||||
{
|
||||
ignorePseudoElements: ['v-deep'],
|
||||
},
|
||||
],
|
||||
'at-rule-no-unknown': [
|
||||
true,
|
||||
{
|
||||
ignoreAtRules: [
|
||||
'tailwind',
|
||||
'apply',
|
||||
'variants',
|
||||
'responsive',
|
||||
'screen',
|
||||
'function',
|
||||
'if',
|
||||
'each',
|
||||
'include',
|
||||
'mixin',
|
||||
'extend',
|
||||
],
|
||||
},
|
||||
],
|
||||
'no-empty-source': null,
|
||||
'string-quotes': null,
|
||||
'named-grid-areas-no-invalid': null,
|
||||
'no-descending-specificity': null,
|
||||
'font-family-no-missing-generic-family-keyword': null,
|
||||
'rule-empty-line-before': [
|
||||
'always',
|
||||
{
|
||||
ignore: ['after-comment', 'first-nested'],
|
||||
},
|
||||
],
|
||||
'unit-no-unknown': [true, { ignoreUnits: ['rpx'] }],
|
||||
'order/order': [
|
||||
[
|
||||
'dollar-variables',
|
||||
'custom-properties',
|
||||
'at-rules',
|
||||
'declarations',
|
||||
{
|
||||
type: 'at-rule',
|
||||
name: 'supports',
|
||||
},
|
||||
{
|
||||
type: 'at-rule',
|
||||
name: 'media',
|
||||
},
|
||||
'rules',
|
||||
],
|
||||
{ severity: 'error' },
|
||||
],
|
||||
},
|
||||
ignoreFiles: ['**/*.js', '**/*.jsx', '**/*.tsx', '**/*.ts'],
|
||||
};
|
7
internal/ts-config/package.json
Normal file
7
internal/ts-config/package.json
Normal file
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"name": "@vben/ts-config",
|
||||
"version": "1.0.0",
|
||||
"private": true,
|
||||
"license": "MIT",
|
||||
"devDependencies": {}
|
||||
}
|
62
package.json
62
package.json
@@ -16,36 +16,36 @@
|
||||
"url": "https://github.com/anncwb"
|
||||
},
|
||||
"scripts": {
|
||||
"commit": "czg",
|
||||
"bootstrap": "pnpm install",
|
||||
"serve": "npm run dev",
|
||||
"dev": "vite",
|
||||
"build": "cross-env NODE_ENV=production vite build && esno ./build/script/postBuild.ts",
|
||||
"build:test": "cross-env vite build --mode test && esno ./build/script/postBuild.ts",
|
||||
"build:no-cache": "pnpm clean:cache && npm run build",
|
||||
"report": "cross-env REPORT=true npm run build",
|
||||
"type:check": "vue-tsc --noEmit --skipLibCheck",
|
||||
"preview": "npm run build && vite preview",
|
||||
"preview:dist": "vite preview",
|
||||
"log": "conventional-changelog -p angular -i CHANGELOG.md -s",
|
||||
"build:test": "cross-env vite build --mode test && esno ./build/script/postBuild.ts",
|
||||
"clean:cache": "rimraf node_modules/.cache/ && rimraf node_modules/.vite",
|
||||
"clean:lib": "rimraf node_modules",
|
||||
"commit": "czg",
|
||||
"dev": "vite",
|
||||
"gen:icon": "esno ./build/generate/icon/index.ts",
|
||||
"preinstall": "npx only-allow pnpm",
|
||||
"postinstall": "turbo run stub",
|
||||
"lint:eslint": "eslint --cache --max-warnings 0 \"{src,mock}/**/*.{vue,ts,tsx}\" --fix",
|
||||
"lint:prettier": "prettier --write \"src/**/*.{js,json,tsx,css,less,scss,vue,html,md}\"",
|
||||
"lint:stylelint": "stylelint --cache --fix \"**/*.{vue,less,postcss,css,scss}\" --cache --cache-location node_modules/.cache/stylelint/",
|
||||
"lint:lint-staged": "lint-staged",
|
||||
"test:unit": "jest",
|
||||
"test:gzip": "npx http-server dist --cors --gzip -c-1",
|
||||
"test:br": "npx http-server dist --cors --brotli -c-1",
|
||||
"reinstall": "rimraf pnpm-lock.yaml && rimraf package.lock.json && rimraf node_modules && npm run bootstrap",
|
||||
"preinstall": "npx only-allow pnpm",
|
||||
"lint:stylelint": "stylelint \"**/*.{vue,css,less.scss}\" --fix --cache --cache-location node_modules/.cache/stylelint/",
|
||||
"log": "conventional-changelog -p angular -i CHANGELOG.md -s",
|
||||
"prepare": "husky install",
|
||||
"gen:icon": "esno ./build/generate/icon/index.ts"
|
||||
"preview": "npm run build && vite preview",
|
||||
"preview:dist": "vite preview",
|
||||
"reinstall": "rimraf pnpm-lock.yaml && rimraf package.lock.json && rimraf node_modules && npm run bootstrap",
|
||||
"report": "cross-env REPORT=true npm run build",
|
||||
"serve": "npm run dev",
|
||||
"test:br": "npx http-server dist --cors --brotli -c-1",
|
||||
"test:gzip": "npx http-server dist --cors --gzip -c-1",
|
||||
"test:unit": "jest",
|
||||
"type:check": "vue-tsc --noEmit --skipLibCheck"
|
||||
},
|
||||
"lint-staged": {
|
||||
"*.{js,jsx,ts,tsx}": [
|
||||
"eslint --fix",
|
||||
"prettier --write"
|
||||
"prettier --write",
|
||||
"eslint --fix"
|
||||
],
|
||||
"{!(package)*.json,*.code-snippets,.!(browserslist)*rc}": [
|
||||
"prettier --write--parser json"
|
||||
@@ -54,13 +54,13 @@
|
||||
"prettier --write"
|
||||
],
|
||||
"*.vue": [
|
||||
"eslint --fix",
|
||||
"prettier --write",
|
||||
"eslint --fix",
|
||||
"stylelint --fix"
|
||||
],
|
||||
"*.{scss,less,styl,html}": [
|
||||
"stylelint --fix",
|
||||
"prettier --write"
|
||||
"prettier --write",
|
||||
"stylelint --fix"
|
||||
],
|
||||
"*.md": [
|
||||
"prettier --write"
|
||||
@@ -133,8 +133,8 @@
|
||||
"@types/qs": "^6.9.7",
|
||||
"@types/showdown": "^2.0.0",
|
||||
"@types/sortablejs": "^1.15.1",
|
||||
"@typescript-eslint/eslint-plugin": "^5.57.0",
|
||||
"@typescript-eslint/parser": "^5.57.0",
|
||||
"@vben/eslint-config": "workspace:*",
|
||||
"@vben/stylelint-config": "workspace:*",
|
||||
"@vitejs/plugin-vue": "^4.1.0",
|
||||
"@vitejs/plugin-vue-jsx": "^3.0.1",
|
||||
"@vue/compiler-sfc": "^3.2.47",
|
||||
@@ -145,31 +145,24 @@
|
||||
"cz-git": "^1.6.1",
|
||||
"czg": "^1.6.1",
|
||||
"dotenv": "^16.0.3",
|
||||
"eslint": "^8.37.0",
|
||||
"eslint-config-prettier": "^8.8.0",
|
||||
"eslint-plugin-prettier": "^4.2.1",
|
||||
"eslint-plugin-vue": "^9.10.0",
|
||||
"esno": "^0.16.3",
|
||||
"fs-extra": "^11.1.1",
|
||||
"husky": "^8.0.3",
|
||||
"inquirer": "^9.1.5",
|
||||
"less": "^4.1.3",
|
||||
"lint-staged": "13.2.0",
|
||||
"npm-run-all": "^4.1.5",
|
||||
"picocolors": "^1.0.0",
|
||||
"postcss": "^8.4.21",
|
||||
"postcss-html": "^1.5.0",
|
||||
"postcss-less": "^6.0.0",
|
||||
"prettier": "^2.8.7",
|
||||
"prettier-plugin-packagejson": "^2.4.3",
|
||||
"rimraf": "^4.4.1",
|
||||
"rollup-plugin-visualizer": "^5.9.0",
|
||||
"sass": "^1.60.0",
|
||||
"stylelint": "^15.4.0",
|
||||
"stylelint-config-recommended": "^11.0.0",
|
||||
"stylelint-config-recommended-vue": "^1.4.0",
|
||||
"stylelint-config-standard": "^32.0.0",
|
||||
"stylelint-order": "^6.0.3",
|
||||
"turbo": "^1.8.8",
|
||||
"typescript": "^5.0.3",
|
||||
"unbuild": "^1.2.0",
|
||||
"vite": "^4.3.0-beta.1",
|
||||
"vite-plugin-compression": "^0.5.1",
|
||||
"vite-plugin-html": "^3.2.0",
|
||||
@@ -177,7 +170,6 @@
|
||||
"vite-plugin-purge-icons": "^0.9.2",
|
||||
"vite-plugin-svg-icons": "^2.0.1",
|
||||
"vite-plugin-windicss": "^1.8.10",
|
||||
"vue-eslint-parser": "^9.1.1",
|
||||
"vue-tsc": "^1.2.0"
|
||||
},
|
||||
"packageManager": "pnpm@8.1.0",
|
||||
|
7682
pnpm-lock.yaml
generated
7682
pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load Diff
@@ -1,2 +1,3 @@
|
||||
packages:
|
||||
- '_internal/*'
|
||||
- 'internal/*'
|
||||
- 'packages/*'
|
||||
|
@@ -44,26 +44,26 @@
|
||||
}
|
||||
|
||||
.@{prefix-cls} {
|
||||
position: relative;
|
||||
display: flex;
|
||||
position: relative;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 50px;
|
||||
height: 26px;
|
||||
padding: 0 6px;
|
||||
margin-left: auto;
|
||||
cursor: pointer;
|
||||
background-color: #151515;
|
||||
padding: 0 6px;
|
||||
border-radius: 30px;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
background-color: #151515;
|
||||
cursor: pointer;
|
||||
|
||||
&-inner {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
background-color: #fff;
|
||||
border-radius: 50%;
|
||||
transition: transform 0.5s, background-color 0.5s;
|
||||
border-radius: 50%;
|
||||
background-color: #fff;
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
|
@@ -64,8 +64,8 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 7px;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
cursor: pointer;
|
||||
|
||||
&.light {
|
||||
border-bottom: 1px solid @border-color-base;
|
||||
@@ -84,9 +84,9 @@
|
||||
}
|
||||
|
||||
&__title {
|
||||
transition: all 0.5s;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
transition: all 0.5s;
|
||||
line-height: normal;
|
||||
}
|
||||
}
|
||||
|
@@ -21,30 +21,30 @@
|
||||
@prefix-cls: ~'@{namespace}-app-search-footer';
|
||||
|
||||
.@{prefix-cls} {
|
||||
position: relative;
|
||||
display: flex;
|
||||
position: relative;
|
||||
flex-shrink: 0;
|
||||
align-items: center;
|
||||
height: 44px;
|
||||
padding: 0 16px;
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
background-color: @component-background;
|
||||
border-top: 1px solid @border-color-base;
|
||||
border-radius: 0 0 16px 16px;
|
||||
align-items: center;
|
||||
flex-shrink: 0;
|
||||
background-color: @component-background;
|
||||
color: #666;
|
||||
font-size: 12px;
|
||||
|
||||
&-item {
|
||||
display: flex;
|
||||
width: 20px;
|
||||
height: 18px;
|
||||
padding-bottom: 2px;
|
||||
margin-right: 0.4em;
|
||||
background-color: linear-gradient(-225deg, #d5dbe4, #f8f8f8);
|
||||
border-radius: 2px;
|
||||
box-shadow: inset 0 -2px 0 0 #cdcde6, inset 0 0 1px 1px #fff,
|
||||
0 1px 2px 1px rgb(30 35 90 / 40%);
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 20px;
|
||||
height: 18px;
|
||||
margin-right: 0.4em;
|
||||
padding-bottom: 2px;
|
||||
border-radius: 2px;
|
||||
background-color: linear-gradient(-225deg, #d5dbe4, #f8f8f8);
|
||||
box-shadow: inset 0 -2px 0 0 #cdcde6, inset 0 0 1px 1px #fff,
|
||||
0 1px 2px 1px rgb(30 35 90 / 40%);
|
||||
|
||||
&:nth-child(2),
|
||||
&:nth-child(3),
|
||||
|
@@ -77,7 +77,7 @@
|
||||
const emit = defineEmits(['close']);
|
||||
|
||||
const scrollWrap = ref(null);
|
||||
const inputRef = ref<Nullable<HTMLElement>>(null);
|
||||
const inputRef = ref<HTMLElement | null>(null);
|
||||
|
||||
const { t } = useI18n();
|
||||
const { prefixCls } = useDesign('app-search-modal');
|
||||
@@ -117,16 +117,16 @@
|
||||
@prefix-cls: ~'@{namespace}-app-search-modal';
|
||||
@footer-prefix-cls: ~'@{namespace}-app-search-footer';
|
||||
.@{prefix-cls} {
|
||||
display: flex;
|
||||
position: fixed;
|
||||
z-index: 800;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 800;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding-top: 50px;
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
justify-content: center;
|
||||
|
||||
&--mobile {
|
||||
padding: 0;
|
||||
@@ -159,7 +159,7 @@
|
||||
|
||||
&__item {
|
||||
&-enter {
|
||||
opacity: 0% !important;
|
||||
opacity: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -167,27 +167,27 @@
|
||||
|
||||
&-content {
|
||||
position: relative;
|
||||
flex-direction: column;
|
||||
width: 632px;
|
||||
margin: 0 auto auto;
|
||||
background-color: @component-background;
|
||||
border-radius: 16px;
|
||||
background-color: @component-background;
|
||||
box-shadow: 0 25px 50px -12px rgb(0 0 0 / 25%);
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
&-input__wrapper {
|
||||
display: flex;
|
||||
padding: 14px 14px 0;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 14px 14px 0;
|
||||
}
|
||||
|
||||
&-input {
|
||||
width: 100%;
|
||||
height: 48px;
|
||||
font-size: 1.5em;
|
||||
color: #1c1e21;
|
||||
border-radius: 6px;
|
||||
color: #1c1e21;
|
||||
font-size: 1.5em;
|
||||
|
||||
span[role='img'] {
|
||||
color: #999;
|
||||
@@ -196,43 +196,43 @@
|
||||
|
||||
&-cancel {
|
||||
display: none;
|
||||
font-size: 1em;
|
||||
color: #666;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
&-not-data {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
font-size: 0.9;
|
||||
color: rgb(150 159 175);
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
color: rgb(150 159 175);
|
||||
font-size: 0.9;
|
||||
}
|
||||
|
||||
&-list {
|
||||
max-height: 472px;
|
||||
padding: 0 14px;
|
||||
padding-bottom: 20px;
|
||||
margin: 0 auto;
|
||||
margin-top: 14px;
|
||||
padding: 0 14px;
|
||||
padding-bottom: 20px;
|
||||
overflow: auto;
|
||||
|
||||
&__item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
position: relative;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 56px;
|
||||
margin-top: 8px;
|
||||
padding-bottom: 4px;
|
||||
padding-left: 14px;
|
||||
margin-top: 8px;
|
||||
font-size: 14px;
|
||||
color: @text-color-base;
|
||||
cursor: pointer;
|
||||
background-color: @component-background;
|
||||
border-radius: 4px;
|
||||
background-color: @component-background;
|
||||
box-shadow: 0 1px 3px 0 #d4d9e1;
|
||||
align-items: center;
|
||||
color: @text-color-base;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
|
||||
> div:first-child,
|
||||
> div:last-child {
|
||||
@@ -241,11 +241,11 @@
|
||||
}
|
||||
|
||||
&--active {
|
||||
color: #fff;
|
||||
background-color: @primary-color;
|
||||
color: #fff;
|
||||
|
||||
.@{prefix-cls}-list__item-enter {
|
||||
opacity: 100%;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -259,7 +259,7 @@
|
||||
|
||||
&-enter {
|
||||
width: 30px;
|
||||
opacity: 0%;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@@ -52,10 +52,10 @@
|
||||
|
||||
.@{prefix-cls} {
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
transform: rotate(0deg);
|
||||
transition: all 0.3s ease 0.1s;
|
||||
transform-origin: center center;
|
||||
transition: all 0.3s ease 0.1s;
|
||||
cursor: pointer;
|
||||
|
||||
&--active {
|
||||
transform: rotate(90deg);
|
||||
|
@@ -97,8 +97,8 @@
|
||||
.@{prefix-cls} {
|
||||
display: inline-block;
|
||||
margin-left: 6px;
|
||||
font-size: 14px;
|
||||
color: @text-color-help-dark;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
|
@@ -43,13 +43,13 @@
|
||||
@prefix-cls: ~'@{namespace}-basic-title';
|
||||
|
||||
.@{prefix-cls} {
|
||||
position: relative;
|
||||
display: flex;
|
||||
position: relative;
|
||||
padding-left: 7px;
|
||||
color: @text-color-base;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
line-height: 24px;
|
||||
color: @text-color-base;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
|
||||
@@ -59,6 +59,7 @@
|
||||
}
|
||||
|
||||
&-show-span::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
left: 0;
|
||||
@@ -66,7 +67,6 @@
|
||||
height: 16px;
|
||||
margin-right: 4px;
|
||||
background-color: @primary-color;
|
||||
content: '';
|
||||
}
|
||||
|
||||
&-help {
|
||||
|
@@ -1,5 +1,5 @@
|
||||
const validColors = ['primary', 'error', 'warning', 'success', ''] as const;
|
||||
type ButtonColorType = typeof validColors[number];
|
||||
type ButtonColorType = (typeof validColors)[number];
|
||||
|
||||
export const buttonProps = {
|
||||
color: {
|
||||
|
@@ -73,7 +73,9 @@
|
||||
{props.loading ? (
|
||||
<Skeleton active={props.loading} />
|
||||
) : (
|
||||
<div class={`${prefixCls}__body`} v-show={show.value}>{slots.default?.()}</div>
|
||||
<div class={`${prefixCls}__body`} v-show={show.value}>
|
||||
{slots.default?.()}
|
||||
</div>
|
||||
)}
|
||||
</CollapseTransition>
|
||||
</div>
|
||||
@@ -89,15 +91,15 @@
|
||||
@prefix-cls: ~'@{namespace}-collapse-container';
|
||||
|
||||
.@{prefix-cls} {
|
||||
background-color: @component-background;
|
||||
border-radius: 2px;
|
||||
transition: all 0.3s ease-in-out;
|
||||
border-radius: 2px;
|
||||
background-color: @component-background;
|
||||
|
||||
&__header {
|
||||
display: flex;
|
||||
height: 32px;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 32px;
|
||||
border-bottom: 1px solid @border-color-light;
|
||||
}
|
||||
|
||||
@@ -107,10 +109,10 @@
|
||||
|
||||
&__action {
|
||||
display: flex;
|
||||
text-align: right;
|
||||
flex: 1;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<script lang="tsx">
|
||||
import { defineComponent, computed, unref, type ExtractPropTypes } from 'vue';
|
||||
import { defineComponent, computed, unref, type ExtractPropTypes, PropType } from 'vue';
|
||||
import { useDesign } from '/@/hooks/web/useDesign';
|
||||
import { BasicArrow, BasicTitle } from '/@/components/Basic';
|
||||
|
||||
@@ -31,7 +31,7 @@
|
||||
</BasicTitle>
|
||||
|
||||
<div class={`${unref(_prefixCls)}__action`}>
|
||||
{slots.action
|
||||
{slots.action
|
||||
? slots.action({ expand: props.show, onClick: () => emit('expand') })
|
||||
: props.canExpan && (
|
||||
<BasicArrow up expand={props.show} onClick={() => emit('expand')} />
|
||||
|
@@ -161,27 +161,27 @@
|
||||
}
|
||||
|
||||
&:not(.ant-menu-item-disabled):hover {
|
||||
color: @text-color-base;
|
||||
background-color: @item-hover-bg;
|
||||
color: @text-color-base;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.context-menu {
|
||||
display: block;
|
||||
position: fixed;
|
||||
z-index: 200;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 200;
|
||||
display: block;
|
||||
width: 156px;
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
background-color: @component-background;
|
||||
border: 1px solid rgb(0 0 0 / 8%);
|
||||
border-radius: 0.25rem;
|
||||
background-clip: padding-box;
|
||||
background-color: @component-background;
|
||||
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%);
|
||||
background-clip: padding-box;
|
||||
list-style: none;
|
||||
user-select: none;
|
||||
|
||||
&__item {
|
||||
|
@@ -50,7 +50,9 @@ export const createContextMenu = function (options: CreateContextOptions) {
|
||||
menuManager.domList.forEach((dom: Element) => {
|
||||
try {
|
||||
dom && body.removeChild(dom);
|
||||
} catch (error) {}
|
||||
} catch (error) {
|
||||
//
|
||||
}
|
||||
});
|
||||
body.removeEventListener('click', handleClick);
|
||||
body.removeEventListener('scroll', handleClick);
|
||||
|
@@ -43,8 +43,8 @@
|
||||
.@{prefix-cls} {
|
||||
.ant-input-group-addon {
|
||||
padding-right: 0;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
|
||||
button {
|
||||
font-size: 14px;
|
||||
|
@@ -113,7 +113,7 @@
|
||||
<script lang="ts">
|
||||
import type { CropendResult, Cropper } from './typing';
|
||||
|
||||
import { defineComponent, ref } from 'vue';
|
||||
import { defineComponent, ref, PropType } from 'vue';
|
||||
import CropperImage from './Cropper.vue';
|
||||
import { Space, Upload, Avatar, Tooltip } from 'ant-design-vue';
|
||||
import { useDesign } from '/@/hooks/web/useDesign';
|
||||
@@ -253,8 +253,8 @@
|
||||
|
||||
&-toolbar {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
@@ -274,11 +274,11 @@
|
||||
|
||||
&-group {
|
||||
display: flex;
|
||||
padding-top: 8px;
|
||||
margin-top: 8px;
|
||||
border-top: 1px solid @border-color-base;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
margin-top: 8px;
|
||||
padding-top: 8px;
|
||||
border-top: 1px solid @border-color-base;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@@ -124,10 +124,10 @@
|
||||
|
||||
&-image-wrapper {
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
background: @component-background;
|
||||
border: 1px solid @border-color-base;
|
||||
border-radius: 50%;
|
||||
background: @component-background;
|
||||
cursor: pointer;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
@@ -135,15 +135,15 @@
|
||||
}
|
||||
|
||||
&-image-mask {
|
||||
opacity: 0%;
|
||||
position: absolute;
|
||||
width: inherit;
|
||||
height: inherit;
|
||||
border-radius: inherit;
|
||||
transition: opacity 0.4s;
|
||||
border: inherit;
|
||||
border-radius: inherit;
|
||||
opacity: 0;
|
||||
background: rgb(0 0 0 / 40%);
|
||||
cursor: pointer;
|
||||
transition: opacity 0.4s;
|
||||
|
||||
::v-deep(svg) {
|
||||
margin: auto;
|
||||
@@ -151,7 +151,7 @@
|
||||
}
|
||||
|
||||
&-image-mask:hover {
|
||||
opacity: 4000%;
|
||||
opacity: 40;
|
||||
}
|
||||
|
||||
&-upload-btn {
|
||||
|
@@ -62,7 +62,7 @@
|
||||
setup(props, { emit }) {
|
||||
const visibleRef = ref(false);
|
||||
const attrs = useAttrs();
|
||||
const propsRef = ref<Partial<Nullable<DrawerProps>>>(null);
|
||||
const propsRef = ref<Partial<DrawerProps | null>>(null);
|
||||
|
||||
const { t } = useI18n();
|
||||
const { prefixVar, prefixCls } = useDesign('basic-drawer');
|
||||
@@ -77,7 +77,7 @@
|
||||
instance && emit('register', drawerInstance, instance.uid);
|
||||
|
||||
const getMergeProps = computed((): DrawerProps => {
|
||||
return deepMerge(toRaw(props), unref(propsRef));
|
||||
return deepMerge(toRaw(props), unref(propsRef)) as any;
|
||||
});
|
||||
|
||||
const getProps = computed((): DrawerProps => {
|
||||
@@ -153,7 +153,7 @@
|
||||
);
|
||||
|
||||
// Cancel event
|
||||
async function onClose(e: Recordable) {
|
||||
async function onClose(e) {
|
||||
const { closeFunc } = unref(getProps);
|
||||
emit('close', e);
|
||||
if (closeFunc && isFunction(closeFunc)) {
|
||||
@@ -215,8 +215,8 @@
|
||||
background-color: @component-background;
|
||||
|
||||
.scrollbar__wrap {
|
||||
padding: 16px !important;
|
||||
margin-bottom: 0 !important;
|
||||
padding: 16px !important;
|
||||
}
|
||||
|
||||
> .scrollbar > .scrollbar__bar.is-horizontal {
|
||||
@@ -229,11 +229,11 @@
|
||||
position: absolute;
|
||||
|
||||
.ant-drawer-header {
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
height: @detail-header-height;
|
||||
padding: 0;
|
||||
border-top: 1px solid @border-color-base;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.ant-drawer-title {
|
||||
|
@@ -71,9 +71,9 @@
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
padding: 0 12px 0 20px;
|
||||
text-align: right;
|
||||
background-color: @component-background;
|
||||
border-top: 1px solid @border-color-base;
|
||||
background-color: @component-background;
|
||||
text-align: right;
|
||||
|
||||
> * {
|
||||
margin-right: 8px;
|
||||
|
@@ -51,8 +51,8 @@
|
||||
@footer-height: 60px;
|
||||
.@{prefix-cls} {
|
||||
display: flex;
|
||||
height: 100%;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
|
||||
&__back {
|
||||
padding: 0 12px;
|
||||
|
@@ -196,7 +196,7 @@
|
||||
/**
|
||||
* @description 文件选择器关闭后,判断取消状态
|
||||
*/
|
||||
function handleFocusChange() {
|
||||
function handleFocusChange() {
|
||||
const timeId = setInterval(() => {
|
||||
if (cancelRef.value === true) {
|
||||
emit('cancel');
|
||||
|
@@ -142,8 +142,8 @@
|
||||
}
|
||||
.@{prefix-cls} {
|
||||
height: 36px;
|
||||
background-color: @app-content-background;
|
||||
border-bottom: 1px solid @border-color-base;
|
||||
background-color: @app-content-background;
|
||||
|
||||
.disabeld {
|
||||
color: @disabled-color;
|
||||
@@ -151,8 +151,8 @@
|
||||
|
||||
&__icon {
|
||||
display: inline-block;
|
||||
padding: 2px 4px;
|
||||
margin-right: 10px;
|
||||
padding: 2px 4px;
|
||||
|
||||
&:hover {
|
||||
color: @primary-color;
|
||||
|
@@ -71,7 +71,7 @@
|
||||
props: basicProps,
|
||||
emits: ['advanced-change', 'reset', 'submit', 'register', 'field-value-change'],
|
||||
setup(props, { emit, attrs }) {
|
||||
const formModel = reactive<Recordable>({});
|
||||
const formModel = reactive({});
|
||||
const modalFn = useModalContext();
|
||||
|
||||
const advanceState = reactive<AdvanceState>({
|
||||
@@ -81,17 +81,17 @@
|
||||
actionSpan: 6,
|
||||
});
|
||||
|
||||
const defaultValueRef = ref<Recordable>({});
|
||||
const defaultValueRef = ref({});
|
||||
const isInitedDefaultRef = ref(false);
|
||||
const propsRef = ref<Partial<FormProps>>({});
|
||||
const schemaRef = ref<Nullable<FormSchema[]>>(null);
|
||||
const formElRef = ref<Nullable<FormActionType>>(null);
|
||||
const schemaRef = ref<FormSchema[] | null>(null);
|
||||
const formElRef = ref<FormActionType | null>(null);
|
||||
|
||||
const { prefixCls } = useDesign('basic-form');
|
||||
|
||||
// Get the basic configuration of the form
|
||||
const getProps = computed((): FormProps => {
|
||||
return { ...props, ...unref(propsRef) } as FormProps;
|
||||
return { ...props, ...unref(propsRef) };
|
||||
});
|
||||
|
||||
const getFormClass = computed(() => {
|
||||
@@ -104,7 +104,7 @@
|
||||
});
|
||||
|
||||
// Get uniform row style and Row configuration for the entire form
|
||||
const getRow = computed((): Recordable => {
|
||||
const getRow = computed(() => {
|
||||
const { baseRowStyle = {}, rowProps } = unref(getProps);
|
||||
return {
|
||||
style: baseRowStyle,
|
||||
@@ -112,9 +112,7 @@
|
||||
};
|
||||
});
|
||||
|
||||
const getBindValue = computed(
|
||||
() => ({ ...attrs, ...props, ...unref(getProps) } as Recordable),
|
||||
);
|
||||
const getBindValue = computed(() => ({ ...attrs, ...props, ...unref(getProps) }));
|
||||
|
||||
const getSchema = computed((): FormSchema[] => {
|
||||
const schemas: FormSchema[] = unref(schemaRef) || (unref(getProps).schemas as any);
|
||||
@@ -297,9 +295,7 @@
|
||||
formActionType: formActionType as any,
|
||||
setFormModel,
|
||||
getFormClass,
|
||||
getFormActionBindProps: computed(
|
||||
(): Recordable => ({ ...getProps.value, ...advanceState }),
|
||||
),
|
||||
getFormActionBindProps: computed(() => ({ ...getProps.value, ...advanceState })),
|
||||
fieldsIsAdvancedMap,
|
||||
...formActionType,
|
||||
};
|
||||
@@ -334,10 +330,10 @@
|
||||
|
||||
.suffix {
|
||||
display: inline-flex;
|
||||
padding-left: 6px;
|
||||
margin-top: 1px;
|
||||
line-height: 1;
|
||||
align-items: center;
|
||||
margin-top: 1px;
|
||||
padding-left: 6px;
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@@ -12,7 +12,7 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent, watch, ref, unref, watchEffect } from 'vue';
|
||||
import { computed, defineComponent, watch, ref, unref, watchEffect, PropType } from 'vue';
|
||||
import { Transfer } from 'ant-design-vue';
|
||||
import { isFunction } from '/@/utils/is';
|
||||
import { get, omit } from 'lodash-es';
|
||||
@@ -25,14 +25,14 @@
|
||||
props: {
|
||||
value: { type: Array as PropType<Array<string>> },
|
||||
api: {
|
||||
type: Function as PropType<(arg?: Recordable) => Promise<TransferItem[]>>,
|
||||
type: Function as PropType<(arg) => Promise<TransferItem[]>>,
|
||||
default: null,
|
||||
},
|
||||
params: { type: Object },
|
||||
dataSource: { type: Array as PropType<Array<TransferItem>> },
|
||||
immediate: propTypes.bool.def(true),
|
||||
alwaysLoad: propTypes.bool.def(false),
|
||||
afterFetch: { type: Function as PropType<Fn> },
|
||||
afterFetch: { type: Function },
|
||||
resultField: propTypes.string.def(''),
|
||||
labelField: propTypes.string.def('title'),
|
||||
valueField: propTypes.string.def('key'),
|
||||
@@ -60,7 +60,7 @@
|
||||
const getdataSource = computed(() => {
|
||||
const { labelField, valueField } = props;
|
||||
|
||||
return unref(_dataSource).reduce((prev, next: Recordable) => {
|
||||
return unref(_dataSource).reduce((prev, next) => {
|
||||
if (next) {
|
||||
prev.push({
|
||||
...omit(next, [labelField, valueField]),
|
||||
@@ -78,7 +78,7 @@
|
||||
if (Array.isArray(props.value)) {
|
||||
return props.value;
|
||||
}
|
||||
if (Array.isArray(props.targetKeys)){
|
||||
if (Array.isArray(props.targetKeys)) {
|
||||
return props.targetKeys;
|
||||
}
|
||||
return [];
|
||||
@@ -125,7 +125,6 @@
|
||||
emitChange();
|
||||
} catch (error) {
|
||||
console.warn(error);
|
||||
} finally {
|
||||
}
|
||||
}
|
||||
function emitChange() {
|
||||
|
@@ -77,9 +77,9 @@ export function useFormValues({
|
||||
// Remove spaces
|
||||
if (isString(value)) {
|
||||
// remove params from URL
|
||||
if(value === '') {
|
||||
if (value === '') {
|
||||
value = undefined;
|
||||
}else {
|
||||
} else {
|
||||
value = value.trim();
|
||||
}
|
||||
}
|
||||
|
@@ -48,7 +48,7 @@
|
||||
prefix: propTypes.string.def(''),
|
||||
},
|
||||
setup(props) {
|
||||
const elRef = ref<ElRef>(null);
|
||||
const elRef = ref(null);
|
||||
|
||||
const isSvgIcon = computed(() => props.icon?.endsWith(SVG_END_WITH_FLAG));
|
||||
const getSvgIcon = computed(() => props.icon.replace(SVG_END_WITH_FLAG, ''));
|
||||
@@ -115,7 +115,7 @@
|
||||
display: block;
|
||||
min-width: 1em;
|
||||
min-height: 1em;
|
||||
background-color: @iconify-bg-color;
|
||||
border-radius: 100%;
|
||||
background-color: @iconify-bg-color;
|
||||
}
|
||||
</style>
|
||||
|
@@ -55,8 +55,8 @@
|
||||
.@{prefix-cls} {
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
fill: currentcolor;
|
||||
vertical-align: -0.15em;
|
||||
fill: currentColor;
|
||||
}
|
||||
|
||||
.svg-icon-spin {
|
||||
|
@@ -48,22 +48,22 @@
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.full-loading {
|
||||
display: flex;
|
||||
position: fixed;
|
||||
z-index: 200;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 200;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: rgb(240 242 245 / 40%);
|
||||
|
||||
&.absolute {
|
||||
position: absolute;
|
||||
z-index: 300;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 300;
|
||||
}
|
||||
}
|
||||
|
||||
|
@@ -160,5 +160,5 @@
|
||||
});
|
||||
</script>
|
||||
<style lang="less">
|
||||
@import './index.less';
|
||||
@import url('./index.less');
|
||||
</style>
|
||||
|
@@ -66,8 +66,8 @@
|
||||
@prefix-cls: ~'@{namespace}-basic-modal-close';
|
||||
.@{prefix-cls} {
|
||||
display: flex;
|
||||
height: 95%;
|
||||
align-items: center;
|
||||
height: 95%;
|
||||
|
||||
> span {
|
||||
margin-left: 48px;
|
||||
|
@@ -28,20 +28,20 @@
|
||||
@prefix-cls: ~'@{namespace}-page-footer';
|
||||
|
||||
.@{prefix-cls} {
|
||||
display: flex;
|
||||
position: fixed;
|
||||
z-index: @page-footer-z-index;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: @page-footer-z-index;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
padding: 0 24px;
|
||||
line-height: 44px;
|
||||
background-color: @component-background;
|
||||
transition: width 0.2s;
|
||||
border-top: 1px solid @border-color-base;
|
||||
background-color: @component-background;
|
||||
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%);
|
||||
transition: width 0.2s;
|
||||
line-height: 44px;
|
||||
|
||||
&__left {
|
||||
flex: 1 1;
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<script lang="tsx">
|
||||
import { defineComponent, ref, unref, computed, reactive, watchEffect } from 'vue';
|
||||
import { defineComponent, ref, unref, computed, reactive, watchEffect, PropType } from 'vue';
|
||||
import { CloseOutlined, LeftOutlined, RightOutlined } from '@ant-design/icons-vue';
|
||||
import resumeSvg from '/@/assets/svg/preview/resume.svg';
|
||||
import rotateSvg from '/@/assets/svg/preview/p-rotate.svg';
|
||||
@@ -435,26 +435,23 @@
|
||||
<style lang="less">
|
||||
.img-preview {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: @preview-comp-z-index;
|
||||
inset: 0;
|
||||
background: rgb(0 0 0 / 50%);
|
||||
user-select: none;
|
||||
|
||||
&-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
color: @white;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&-image {
|
||||
cursor: pointer;
|
||||
transition: transform 0.3s;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&__close {
|
||||
@@ -464,11 +461,11 @@
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
overflow: hidden;
|
||||
transition: all 0.2s;
|
||||
border-radius: 50%;
|
||||
background-color: rgb(0 0 0 / 50%);
|
||||
color: @white;
|
||||
cursor: pointer;
|
||||
background-color: rgb(0 0 0 / 50%);
|
||||
border-radius: 50%;
|
||||
transition: all 0.2s;
|
||||
|
||||
&-icon {
|
||||
position: absolute;
|
||||
@@ -487,32 +484,32 @@
|
||||
bottom: 5%;
|
||||
left: 50%;
|
||||
padding: 0 22px;
|
||||
font-size: 16px;
|
||||
background: rgb(109 109 109 / 60%);
|
||||
border-radius: 15px;
|
||||
transform: translateX(-50%);
|
||||
border-radius: 15px;
|
||||
background: rgb(109 109 109 / 60%);
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
&__controller {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
bottom: 10%;
|
||||
left: 50%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 260px;
|
||||
height: 44px;
|
||||
padding: 0 22px;
|
||||
margin-left: -139px;
|
||||
background: rgb(109 109 109 / 60%);
|
||||
padding: 0 22px;
|
||||
border-radius: 22px;
|
||||
justify-content: center;
|
||||
background: rgb(109 109 109 / 60%);
|
||||
|
||||
&-item {
|
||||
display: flex;
|
||||
height: 100%;
|
||||
padding: 0 9px;
|
||||
transition: all 0.2s;
|
||||
font-size: 24px;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
|
||||
&:hover {
|
||||
transform: scale(1.2);
|
||||
@@ -525,18 +522,18 @@
|
||||
}
|
||||
|
||||
&__arrow {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
transition: all 0.2s;
|
||||
border-radius: 50%;
|
||||
background-color: rgb(0 0 0 / 50%);
|
||||
font-size: 28px;
|
||||
cursor: pointer;
|
||||
background-color: rgb(0 0 0 / 50%);
|
||||
border-radius: 50%;
|
||||
transition: all 0.2s;
|
||||
|
||||
&:hover {
|
||||
background-color: rgb(0 0 0 / 80%);
|
||||
|
@@ -148,20 +148,20 @@
|
||||
display: none;
|
||||
width: 0;
|
||||
height: 0;
|
||||
opacity: 0%;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__thumb {
|
||||
position: relative;
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 0;
|
||||
height: 0;
|
||||
cursor: pointer;
|
||||
background-color: rgb(144 147 153 / 30%);
|
||||
border-radius: inherit;
|
||||
transition: 0.3s background-color;
|
||||
border-radius: inherit;
|
||||
background-color: rgb(144 147 153 / 30%);
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background-color: rgb(144 147 153 / 50%);
|
||||
@@ -170,12 +170,12 @@
|
||||
|
||||
&__bar {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
right: 2px;
|
||||
bottom: 2px;
|
||||
z-index: 1;
|
||||
border-radius: 4px;
|
||||
opacity: 0%;
|
||||
transition: opacity 80ms ease;
|
||||
border-radius: 4px;
|
||||
opacity: 0;
|
||||
|
||||
&.is-vertical {
|
||||
top: 2px;
|
||||
@@ -200,7 +200,7 @@
|
||||
.scrollbar:active > .scrollbar__bar,
|
||||
.scrollbar:focus > .scrollbar__bar,
|
||||
.scrollbar:hover > .scrollbar__bar {
|
||||
opacity: 100%;
|
||||
transition: opacity 340ms ease-out;
|
||||
opacity: 1;
|
||||
}
|
||||
</style>
|
||||
|
@@ -21,7 +21,7 @@
|
||||
import type { MenuState } from './types';
|
||||
import type { Menu as MenuType } from '/@/router/types';
|
||||
import type { RouteLocationNormalizedLoaded } from 'vue-router';
|
||||
import { defineComponent, computed, ref, unref, reactive, toRefs, watch } from 'vue';
|
||||
import { defineComponent, computed, ref, unref, reactive, toRefs, watch, PropType } from 'vue';
|
||||
import { useDesign } from '/@/hooks/web/useDesign';
|
||||
import Menu from './components/Menu.vue';
|
||||
import SimpleSubMenu from './SimpleSubMenu.vue';
|
||||
@@ -74,8 +74,8 @@
|
||||
menuState,
|
||||
items,
|
||||
accordion,
|
||||
mixSider,
|
||||
collapse,
|
||||
mixSider as any,
|
||||
collapse as any,
|
||||
);
|
||||
|
||||
const getBindValues = computed(() => ({ ...attrs, ...props }));
|
||||
@@ -156,5 +156,5 @@
|
||||
});
|
||||
</script>
|
||||
<style lang="less">
|
||||
@import './index.less';
|
||||
@import url('./index.less');
|
||||
</style>
|
||||
|
@@ -154,5 +154,5 @@
|
||||
});
|
||||
</script>
|
||||
<style lang="less">
|
||||
@import './menu.less';
|
||||
@import url('./menu.less');
|
||||
</style>
|
||||
|
@@ -47,7 +47,7 @@
|
||||
return score;
|
||||
});
|
||||
|
||||
function handleChange(e: ChangeEvent) {
|
||||
function handleChange(e) {
|
||||
innerValueRef.value = e.target.value;
|
||||
}
|
||||
|
||||
@@ -79,21 +79,21 @@
|
||||
position: relative;
|
||||
height: 6px;
|
||||
margin: 10px auto 6px;
|
||||
background-color: @disabled-color;
|
||||
border-radius: 6px;
|
||||
background-color: @disabled-color;
|
||||
|
||||
&::before,
|
||||
&::after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
display: block;
|
||||
width: 20%;
|
||||
height: inherit;
|
||||
background-color: transparent;
|
||||
border-color: @white;
|
||||
border-style: solid;
|
||||
border-width: 0 5px;
|
||||
content: '';
|
||||
border-style: solid;
|
||||
border-color: @white;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
&::before {
|
||||
@@ -108,9 +108,9 @@
|
||||
position: absolute;
|
||||
width: 0;
|
||||
height: inherit;
|
||||
background-color: transparent;
|
||||
border-radius: inherit;
|
||||
transition: width 0.5s ease-in-out, background 0.25s;
|
||||
border-radius: inherit;
|
||||
background-color: transparent;
|
||||
|
||||
&[data-score='0'] {
|
||||
width: 20%;
|
||||
|
@@ -102,7 +102,7 @@
|
||||
],
|
||||
setup(props, { attrs, emit, slots, expose }) {
|
||||
const tableElRef = ref(null);
|
||||
const tableData = ref<Recordable[]>([]);
|
||||
const tableData = ref([]);
|
||||
|
||||
const wrapRef = ref(null);
|
||||
const formRef = ref(null);
|
||||
@@ -239,7 +239,7 @@
|
||||
|
||||
const getBindValues = computed(() => {
|
||||
const dataSource = unref(getDataSourceRef);
|
||||
let propsData: Recordable = {
|
||||
let propsData: any = {
|
||||
...attrs,
|
||||
customRow,
|
||||
...unref(getProps),
|
||||
@@ -379,10 +379,10 @@
|
||||
|
||||
.ant-form {
|
||||
width: 100%;
|
||||
padding: 12px 10px 6px;
|
||||
margin-bottom: 16px;
|
||||
background-color: @component-background;
|
||||
padding: 12px 10px 6px;
|
||||
border-radius: 2px;
|
||||
background-color: @component-background;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -394,8 +394,8 @@
|
||||
|
||||
.ant-table-wrapper {
|
||||
padding: 6px;
|
||||
background-color: @component-background;
|
||||
border-radius: 2px;
|
||||
background-color: @component-background;
|
||||
|
||||
.ant-table-title {
|
||||
min-height: 40px;
|
||||
@@ -413,10 +413,10 @@
|
||||
|
||||
&-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 8px 6px;
|
||||
border-bottom: none;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
//.ant-table-tbody > tr.ant-table-row-selected td {
|
||||
|
@@ -40,7 +40,7 @@
|
||||
},
|
||||
props: {
|
||||
title: {
|
||||
type: [Function, String] as PropType<string | ((data: Recordable) => string)>,
|
||||
type: [Function, String] as PropType<string | ((data) => string)>,
|
||||
},
|
||||
tableSetting: {
|
||||
type: Object as PropType<TableSetting>,
|
||||
@@ -68,8 +68,8 @@
|
||||
|
||||
.@{prefix-cls} {
|
||||
&__toolbar {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex: 1;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
|
||||
|
@@ -14,10 +14,10 @@
|
||||
components: { BasicTitle },
|
||||
props: {
|
||||
title: {
|
||||
type: [Function, String] as PropType<string | ((data: Recordable) => string)>,
|
||||
type: [Function, String] as PropType<string | ((data) => string)>,
|
||||
},
|
||||
getSelectRows: {
|
||||
type: Function as PropType<() => Recordable[]>,
|
||||
type: Function as PropType<() => any[]>,
|
||||
},
|
||||
helpMessage: {
|
||||
type: [String, Array] as PropType<string | string[]>,
|
||||
@@ -47,7 +47,7 @@
|
||||
|
||||
.@{prefix-cls} {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
</style>
|
||||
|
@@ -2,7 +2,6 @@
|
||||
import type { CSSProperties, PropType } from 'vue';
|
||||
import { computed, defineComponent, nextTick, ref, toRaw, unref, watchEffect } from 'vue';
|
||||
import type { BasicColumn } from '../../types/table';
|
||||
import type { EditRecordRow } from './index';
|
||||
import { CheckOutlined, CloseOutlined, FormOutlined } from '@ant-design/icons-vue';
|
||||
import { CellComponent } from './CellComponent';
|
||||
|
||||
@@ -26,11 +25,13 @@
|
||||
},
|
||||
props: {
|
||||
value: {
|
||||
type: [String, Number, Boolean, Object] as PropType<string | number | boolean | Recordable>,
|
||||
type: [String, Number, Boolean, Object] as PropType<
|
||||
string | number | boolean | Record<string, any>
|
||||
>,
|
||||
default: '',
|
||||
},
|
||||
record: {
|
||||
type: Object as PropType<EditRecordRow>,
|
||||
type: Object as any,
|
||||
},
|
||||
column: {
|
||||
type: Object as PropType<BasicColumn>,
|
||||
@@ -44,7 +45,7 @@
|
||||
const elRef = ref();
|
||||
const ruleVisible = ref(false);
|
||||
const ruleMessage = ref('');
|
||||
const optionsRef = ref<LabelValueOptions>([]);
|
||||
const optionsRef = ref([]);
|
||||
const currentValueRef = ref<any>(props.value);
|
||||
const defaultValueRef = ref<any>(props.value);
|
||||
const spinning = ref<boolean>(false);
|
||||
@@ -71,7 +72,7 @@
|
||||
|
||||
const value = isCheckValue ? (isNumber(val) && isBoolean(val) ? val : !!val) : val;
|
||||
|
||||
let compProps = props.column?.editComponentProps ?? {};
|
||||
let compProps = props.column?.editComponentProps ?? ({} as any);
|
||||
const { record, column, index } = props;
|
||||
|
||||
if (isFunction(compProps)) {
|
||||
@@ -83,7 +84,7 @@
|
||||
delete compProps.onChange;
|
||||
|
||||
const component = unref(getComponent);
|
||||
const apiSelectProps: Recordable = {};
|
||||
const apiSelectProps: Record<string, any> = {};
|
||||
if (component === 'ApiSelect') {
|
||||
apiSelectProps.cache = true;
|
||||
}
|
||||
@@ -131,8 +132,7 @@
|
||||
return value;
|
||||
}
|
||||
|
||||
const options: LabelValueOptions =
|
||||
unref(getComponentProps)?.options ?? (unref(optionsRef) || []);
|
||||
const options = unref(getComponentProps)?.options ?? (unref(optionsRef) || []);
|
||||
const option = options.find((item) => `${item.value}` === `${value}`);
|
||||
|
||||
return option?.label ?? value;
|
||||
@@ -184,11 +184,11 @@
|
||||
if (!e) {
|
||||
currentValueRef.value = e;
|
||||
} else if (component === 'Checkbox') {
|
||||
currentValueRef.value = (e as ChangeEvent).target.checked;
|
||||
currentValueRef.value = e.target.checked;
|
||||
} else if (component === 'Switch') {
|
||||
currentValueRef.value = e;
|
||||
} else if (e?.target && Reflect.has(e.target, 'value')) {
|
||||
currentValueRef.value = (e as ChangeEvent).target.value;
|
||||
currentValueRef.value = e.target.value;
|
||||
} else if (isString(e) || isBoolean(e) || isNumber(e) || isArray(e)) {
|
||||
currentValueRef.value = e;
|
||||
}
|
||||
@@ -216,8 +216,8 @@
|
||||
return false;
|
||||
}
|
||||
if (isFunction(editRule)) {
|
||||
const res = await editRule(currentValue, record as Recordable);
|
||||
if (!!res) {
|
||||
const res = await editRule(currentValue, record);
|
||||
if (res) {
|
||||
ruleMessage.value = res;
|
||||
ruleVisible.value = true;
|
||||
return false;
|
||||
@@ -316,25 +316,25 @@
|
||||
}
|
||||
|
||||
// only ApiSelect or TreeSelect
|
||||
function handleOptionsChange(options: LabelValueOptions) {
|
||||
function handleOptionsChange(options) {
|
||||
const { replaceFields } = unref(getComponentProps);
|
||||
const component = unref(getComponent);
|
||||
if (component === 'ApiTreeSelect') {
|
||||
const { title = 'title', value = 'value', children = 'children' } = replaceFields || {};
|
||||
let listOptions: Recordable[] = treeToList(options, { children });
|
||||
let listOptions = treeToList(options, { children });
|
||||
listOptions = listOptions.map((item) => {
|
||||
return {
|
||||
label: item[title],
|
||||
value: item[value],
|
||||
};
|
||||
});
|
||||
optionsRef.value = listOptions as LabelValueOptions;
|
||||
optionsRef.value = listOptions;
|
||||
} else {
|
||||
optionsRef.value = options;
|
||||
}
|
||||
}
|
||||
|
||||
function initCbs(cbs: 'submitCbs' | 'validCbs' | 'cancelCbs', handle: Fn) {
|
||||
function initCbs(cbs: 'submitCbs' | 'validCbs' | 'cancelCbs', handle) {
|
||||
if (props.record) {
|
||||
/* eslint-disable */
|
||||
isArray(props.record[cbs])
|
||||
@@ -476,9 +476,9 @@
|
||||
.edit-cell-rule-popover {
|
||||
.ant-popover-inner-content {
|
||||
padding: 4px 8px;
|
||||
color: @error-color;
|
||||
// border: 1px solid @error-color;
|
||||
border-radius: 2px;
|
||||
color: @error-color;
|
||||
}
|
||||
}
|
||||
.@{prefix-cls} {
|
||||
@@ -506,20 +506,20 @@
|
||||
|
||||
.ellipsis-cell {
|
||||
.cell-content {
|
||||
overflow-wrap: break-word;
|
||||
word-break: break-word;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-word;
|
||||
white-space: nowrap;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
}
|
||||
|
||||
&__normal {
|
||||
&-icon {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 0;
|
||||
display: none;
|
||||
width: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
@@ -165,7 +165,7 @@
|
||||
|
||||
const plainSortOptions = ref<Options[]>([]);
|
||||
|
||||
const columnListRef = ref<ComponentRef>(null);
|
||||
const columnListRef = ref(null);
|
||||
|
||||
const state = reactive<State>({
|
||||
checkAll: true,
|
||||
@@ -291,7 +291,7 @@
|
||||
nextTick(() => {
|
||||
const columnListEl = unref(columnListRef);
|
||||
if (!columnListEl) return;
|
||||
const el = columnListEl.$el as any;
|
||||
const el = (columnListEl as any).$el;
|
||||
if (!el) return;
|
||||
// Drag and drop sort
|
||||
sortable = Sortablejs.create(unref(el), {
|
||||
@@ -416,8 +416,8 @@
|
||||
|
||||
.@{prefix-cls} {
|
||||
&__popover-title {
|
||||
position: relative;
|
||||
display: flex;
|
||||
position: relative;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
@@ -30,7 +30,7 @@ export function useTableForm(
|
||||
|
||||
function replaceFormSlotKey(key: string) {
|
||||
if (!key) return '';
|
||||
return key?.replace?.(/form\-/, '') ?? '';
|
||||
return key?.replace?.(/form-/, '') ?? '';
|
||||
}
|
||||
|
||||
function handleSearchInfoChange(info: Recordable) {
|
||||
|
@@ -311,7 +311,6 @@ export interface BasicTableProps<T = any> {
|
||||
* @type object
|
||||
*/
|
||||
scroll?: { x?: number | string | true; y?: number | string };
|
||||
|
||||
|
||||
/**
|
||||
* Whether to show table header
|
||||
|
@@ -62,6 +62,7 @@
|
||||
watch,
|
||||
onDeactivated,
|
||||
onBeforeUnmount,
|
||||
PropType,
|
||||
} from 'vue';
|
||||
import ImgUpload from './ImgUpload.vue';
|
||||
import { toolbar, plugins } from './tinymce';
|
||||
@@ -116,10 +117,10 @@
|
||||
props: tinymceProps,
|
||||
emits: ['change', 'update:modelValue', 'inited', 'init-error'],
|
||||
setup(props, { emit, attrs }) {
|
||||
const editorRef = ref<Nullable<Editor>>(null);
|
||||
const editorRef = ref<Editor | null>(null);
|
||||
const fullscreen = ref(false);
|
||||
const tinymceId = ref<string>(buildShortUUID('tiny-vue'));
|
||||
const elRef = ref<Nullable<HTMLElement>>(null);
|
||||
const elRef = ref<HTMLElement | null>(null);
|
||||
|
||||
const { prefixCls } = useDesign('tinymce-container');
|
||||
|
||||
@@ -245,7 +246,7 @@
|
||||
bindHandlers(e, attrs, unref(editorRef));
|
||||
}
|
||||
|
||||
function setValue(editor: Recordable, val: string, prevVal?: string) {
|
||||
function setValue(editor: Record<string, any>, val: string, prevVal?: string) {
|
||||
if (
|
||||
editor &&
|
||||
typeof val === 'string' &&
|
||||
@@ -339,8 +340,8 @@
|
||||
line-height: normal;
|
||||
|
||||
textarea {
|
||||
z-index: -1;
|
||||
visibility: hidden;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@@ -49,7 +49,7 @@
|
||||
};
|
||||
});
|
||||
|
||||
function handleChange(info: Recordable) {
|
||||
function handleChange(info: Record<string, any>) {
|
||||
const file = info.file;
|
||||
const status = file?.status;
|
||||
const url = file?.response?.url;
|
||||
@@ -84,9 +84,9 @@
|
||||
|
||||
.@{prefix-cls} {
|
||||
position: absolute;
|
||||
z-index: 20;
|
||||
top: 4px;
|
||||
right: 10px;
|
||||
z-index: 20;
|
||||
|
||||
&.fullscreen {
|
||||
position: fixed;
|
||||
|
@@ -1,7 +1,6 @@
|
||||
import type { VNode, FunctionalComponent } from 'vue';
|
||||
|
||||
import { h } from 'vue';
|
||||
import { isString } from '@vue/shared';
|
||||
import { isString } from 'lodash-es';
|
||||
import { Icon } from '/@/components/Icon';
|
||||
|
||||
export const TreeIcon: FunctionalComponent = ({ icon }: { icon: VNode | string }) => {
|
||||
|
@@ -19,10 +19,10 @@
|
||||
<style lang="less">
|
||||
.thumb {
|
||||
img {
|
||||
position: static;
|
||||
display: block;
|
||||
cursor: zoom-in;
|
||||
position: static;
|
||||
border-radius: 4px;
|
||||
cursor: zoom-in;
|
||||
object-fit: cover;
|
||||
}
|
||||
}
|
||||
|
@@ -180,7 +180,7 @@
|
||||
}
|
||||
try {
|
||||
item.status = UploadResultStatus.UPLOADING;
|
||||
const { data } = await props.api?.(
|
||||
const ret = await props.api?.(
|
||||
{
|
||||
data: {
|
||||
...(props.uploadParams || {}),
|
||||
@@ -194,6 +194,7 @@
|
||||
item.percent = complete;
|
||||
},
|
||||
);
|
||||
const { data } = ret;
|
||||
item.status = UploadResultStatus.SUCCESS;
|
||||
item.responseData = data;
|
||||
return {
|
||||
@@ -313,9 +314,9 @@
|
||||
margin-bottom: 8px;
|
||||
|
||||
&__btn {
|
||||
flex: 1;
|
||||
margin-left: 8px;
|
||||
text-align: right;
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@@ -291,17 +291,17 @@
|
||||
.darg-verify {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
background-color: rgb(238 238 238);
|
||||
border: 1px solid #ddd;
|
||||
border-radius: @radius;
|
||||
background-color: rgb(238 238 238);
|
||||
text-align: center;
|
||||
|
||||
&-bar {
|
||||
position: absolute;
|
||||
width: 0;
|
||||
height: 36px;
|
||||
background-color: @success-color;
|
||||
border-radius: @radius;
|
||||
background-color: @success-color;
|
||||
|
||||
&.to-left {
|
||||
width: 0 !important;
|
||||
@@ -312,8 +312,8 @@
|
||||
&-content {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
font-size: 12px;
|
||||
text-size-adjust: none;
|
||||
animation: slidetounlock 3s infinite;
|
||||
background-clip: text;
|
||||
background-color: -webkit-gradient(
|
||||
linear,
|
||||
left top,
|
||||
@@ -324,9 +324,9 @@
|
||||
color-stop(0.6, #333),
|
||||
color-stop(1, #333)
|
||||
);
|
||||
animation: slidetounlock 3s infinite;
|
||||
background-clip: text;
|
||||
font-size: 12px;
|
||||
user-select: none;
|
||||
text-size-adjust: none;
|
||||
|
||||
&.success {
|
||||
-webkit-text-fill-color: @white;
|
||||
@@ -338,15 +338,15 @@
|
||||
}
|
||||
|
||||
&-action {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: flex;
|
||||
cursor: move;
|
||||
background-color: @white;
|
||||
border-radius: @radius;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: @radius;
|
||||
background-color: @white;
|
||||
cursor: move;
|
||||
|
||||
&__icon {
|
||||
cursor: inherit;
|
||||
|
@@ -13,7 +13,7 @@
|
||||
props: rotateProps,
|
||||
emits: ['success', 'change', 'update:value'],
|
||||
setup(props, { emit, attrs, expose }) {
|
||||
const basicRef = ref<Nullable<DragVerifyActionType>>(null);
|
||||
const basicRef = ref<DragVerifyActionType | null>(null);
|
||||
const state = reactive({
|
||||
showTip: false,
|
||||
isPassing: false,
|
||||
@@ -167,8 +167,8 @@
|
||||
</script>
|
||||
<style lang="less">
|
||||
.ir-dv {
|
||||
position: relative;
|
||||
display: flex;
|
||||
position: relative;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
@@ -188,16 +188,16 @@
|
||||
}
|
||||
|
||||
&-img__tip {
|
||||
display: block;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
bottom: 10px;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
color: @white;
|
||||
font-size: 12px;
|
||||
line-height: 30px;
|
||||
color: @white;
|
||||
text-align: center;
|
||||
|
||||
&.success {
|
||||
|
@@ -9,6 +9,7 @@
|
||||
watch,
|
||||
nextTick,
|
||||
CSSProperties,
|
||||
PropType,
|
||||
} from 'vue';
|
||||
import { useEventListener } from '/@/hooks/event/useEventListener';
|
||||
import { getSlot } from '/@/utils/helper/tsxHelper';
|
||||
@@ -31,7 +32,7 @@
|
||||
required: true,
|
||||
},
|
||||
items: {
|
||||
type: Array as PropType<any[]>,
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
};
|
||||
@@ -82,7 +83,7 @@
|
||||
});
|
||||
|
||||
const getWrapStyleRef = computed((): CSSProperties => {
|
||||
const styles: Recordable<string> = {};
|
||||
const styles: Record<string, any> = {};
|
||||
const height = convertToUnit(props.height);
|
||||
const minHeight = convertToUnit(props.minHeight);
|
||||
const minWidth = convertToUnit(props.minWidth);
|
||||
@@ -170,12 +171,12 @@
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.virtual-scroll {
|
||||
position: relative;
|
||||
display: block;
|
||||
position: relative;
|
||||
flex: 1 1 auto;
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
overflow: auto;
|
||||
flex: 1 1 auto;
|
||||
|
||||
&__container {
|
||||
display: block;
|
||||
|
@@ -12,7 +12,7 @@ export const useGlobSetting = (): Readonly<GlobConfig> => {
|
||||
VITE_GLOB_UPLOAD_URL,
|
||||
} = getAppEnvConfig();
|
||||
|
||||
if (!/[a-zA-Z\_]*/.test(VITE_GLOB_APP_SHORT_NAME)) {
|
||||
if (!/[a-zA-Z_]*/.test(VITE_GLOB_APP_SHORT_NAME)) {
|
||||
warn(
|
||||
`VITE_GLOB_APP_SHORT_NAME Variables can only be characters/underscores, please modify in the environment variables and re-running.`,
|
||||
);
|
||||
|
@@ -36,7 +36,7 @@
|
||||
position: relative;
|
||||
flex: 1 1 auto;
|
||||
min-height: 0;
|
||||
|
||||
|
||||
// begin: 下面这块代码 在我的项目打包后在比较宽的屏幕(2K 31 寸)有显示 bug 有偶发性 清缓存首次进入会出现 , 刷新就没了, 这里为什么要指定宽度 ?
|
||||
&.fixed {
|
||||
width: 1200px;
|
||||
@@ -46,8 +46,8 @@
|
||||
|
||||
&-loading {
|
||||
position: absolute;
|
||||
top: 200px;
|
||||
z-index: @page-loading-z-index;
|
||||
top: 200px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@@ -62,18 +62,18 @@
|
||||
@prefix-cls: ~'@{namespace}-setting-drawer-feature';
|
||||
|
||||
.@{prefix-cls} {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
top: 45%;
|
||||
right: 0;
|
||||
z-index: 10;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 10px;
|
||||
border-radius: 6px 0 0 6px;
|
||||
background-color: @primary-color;
|
||||
color: @white;
|
||||
cursor: pointer;
|
||||
background-color: @primary-color;
|
||||
border-radius: 6px 0 0 6px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
svg {
|
||||
width: 1em;
|
||||
|
@@ -109,8 +109,8 @@
|
||||
@prefix-cls: ~'@{namespace}-layout-multiple-header';
|
||||
|
||||
.@{prefix-cls} {
|
||||
transition: width 0.2s;
|
||||
flex: 0 0 auto;
|
||||
transition: width 0.2s;
|
||||
|
||||
&--dark {
|
||||
margin-left: -1px;
|
||||
@@ -118,8 +118,8 @@
|
||||
|
||||
&--fixed {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
z-index: @multiple-tab-fixed-z-index;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
@@ -154,8 +154,8 @@
|
||||
|
||||
.@{prefix-cls} {
|
||||
display: flex;
|
||||
padding: 0 8px;
|
||||
align-items: center;
|
||||
padding: 0 8px;
|
||||
|
||||
.ant-breadcrumb-link {
|
||||
.anticon {
|
||||
|
@@ -151,17 +151,17 @@
|
||||
&-item {
|
||||
padding: 6px;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s;
|
||||
cursor: pointer;
|
||||
|
||||
.title {
|
||||
margin-bottom: 8px;
|
||||
font-weight: normal;
|
||||
|
||||
.extra {
|
||||
float: right;
|
||||
margin-top: -1.5px;
|
||||
margin-right: 0;
|
||||
float: right;
|
||||
font-weight: normal;
|
||||
|
||||
.tag {
|
||||
|
@@ -126,13 +126,13 @@
|
||||
@prefix-cls: ~'@{namespace}-header-user-dropdown';
|
||||
|
||||
.@{prefix-cls} {
|
||||
align-items: center;
|
||||
height: @header-height;
|
||||
padding: 0 0 0 10px;
|
||||
padding-right: 10px;
|
||||
overflow: hidden;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
align-items: center;
|
||||
|
||||
img {
|
||||
width: 24px;
|
||||
|
@@ -197,5 +197,5 @@
|
||||
});
|
||||
</script>
|
||||
<style lang="less">
|
||||
@import './index.less';
|
||||
@import url('./index.less');
|
||||
</style>
|
||||
|
@@ -75,10 +75,10 @@
|
||||
|
||||
.@{prefix-cls} {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
min-height: 100%;
|
||||
background-color: @content-bg;
|
||||
flex-direction: column;
|
||||
|
||||
> .ant-layout {
|
||||
min-height: 100%;
|
||||
|
@@ -33,7 +33,7 @@
|
||||
isHorizontal: propTypes.bool,
|
||||
// menu Mode
|
||||
menuMode: {
|
||||
type: [String] as PropType<Nullable<MenuModeEnum>>,
|
||||
type: [String] as PropType<MenuModeEnum | null>,
|
||||
default: '',
|
||||
},
|
||||
},
|
||||
@@ -189,7 +189,7 @@
|
||||
&--mobile {
|
||||
.@{logo-prefix-cls} {
|
||||
&__title {
|
||||
opacity: 100%;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@@ -100,7 +100,7 @@ export default defineComponent({
|
||||
<>
|
||||
<TypePicker
|
||||
menuTypeList={menuTypeList}
|
||||
handler={(item: typeof menuTypeList[0]) => {
|
||||
handler={(item: (typeof menuTypeList)[0]) => {
|
||||
baseHandler(HandlerEnum.CHANGE_LAYOUT, {
|
||||
mode: item.mode,
|
||||
type: item.type,
|
||||
|
@@ -59,15 +59,15 @@
|
||||
.@{prefix-cls} {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin: 16px 0;
|
||||
justify-content: space-around;
|
||||
margin: 16px 0;
|
||||
|
||||
&__item {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
cursor: pointer;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 2px;
|
||||
cursor: pointer;
|
||||
|
||||
svg {
|
||||
display: none;
|
||||
@@ -79,8 +79,8 @@
|
||||
svg {
|
||||
display: inline-block;
|
||||
margin: 0 0 3px 3px;
|
||||
font-size: 12px;
|
||||
fill: @white !important;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@@ -34,7 +34,7 @@
|
||||
default: () => [],
|
||||
},
|
||||
handler: {
|
||||
type: Function as PropType<Fn>,
|
||||
type: Function,
|
||||
default: () => ({}),
|
||||
},
|
||||
def: {
|
||||
@@ -63,27 +63,27 @@
|
||||
height: 48px;
|
||||
margin-right: 16px;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
background-color: #f0f2f5;
|
||||
border-radius: 4px;
|
||||
background-color: #f0f2f5;
|
||||
box-shadow: 0 1px 2.5px 0 rgb(0 0 0 / 18%);
|
||||
cursor: pointer;
|
||||
|
||||
&::before,
|
||||
&::after {
|
||||
position: absolute;
|
||||
content: '';
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
&--sidebar,
|
||||
&--light {
|
||||
&::before {
|
||||
z-index: 1;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
width: 33%;
|
||||
height: 100%;
|
||||
background-color: #273352;
|
||||
border-radius: 4px 0 0 4px;
|
||||
background-color: #273352;
|
||||
}
|
||||
|
||||
&::after {
|
||||
@@ -101,14 +101,14 @@
|
||||
left: 0;
|
||||
width: 33%;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
border-radius: 4px 0 0 4px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
&::after {
|
||||
z-index: 1;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
height: 25%;
|
||||
background-color: #273352;
|
||||
@@ -131,13 +131,13 @@
|
||||
|
||||
&--mix-sidebar {
|
||||
&::before {
|
||||
z-index: 1;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
width: 25%;
|
||||
height: 100%;
|
||||
background-color: #273352;
|
||||
border-radius: 4px 0 0 4px;
|
||||
background-color: #273352;
|
||||
}
|
||||
|
||||
&::after {
|
||||
|
@@ -45,14 +45,14 @@
|
||||
|
||||
.@{prefix-cls} {
|
||||
position: absolute;
|
||||
z-index: @side-drag-z-index;
|
||||
top: 0;
|
||||
right: -2px;
|
||||
z-index: @side-drag-z-index;
|
||||
width: 2px;
|
||||
height: 100%;
|
||||
cursor: col-resize;
|
||||
border-top: none;
|
||||
border-bottom: none;
|
||||
cursor: col-resize;
|
||||
|
||||
&--hide {
|
||||
display: none;
|
||||
|
@@ -44,8 +44,8 @@
|
||||
name: 'LayoutSideBar',
|
||||
components: { Sider: Layout.Sider, LayoutMenu, DragBar, LayoutTrigger },
|
||||
setup() {
|
||||
const dragBarRef = ref<ElRef>(null);
|
||||
const sideRef = ref<ElRef>(null);
|
||||
const dragBarRef = ref(null);
|
||||
const sideRef = ref(null);
|
||||
|
||||
const {
|
||||
getCollapsed,
|
||||
@@ -153,12 +153,12 @@
|
||||
background-color: @sider-dark-bg-color;
|
||||
|
||||
.ant-layout-sider-trigger {
|
||||
color: darken(@white, 25%);
|
||||
background-color: @trigger-dark-bg-color;
|
||||
color: darken(@white, 25%);
|
||||
|
||||
&:hover {
|
||||
color: @white;
|
||||
background-color: @trigger-dark-hover-bg-color;
|
||||
color: @white;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -167,14 +167,14 @@
|
||||
// box-shadow: 2px 0 8px 0 rgba(29, 35, 41, 0.05);
|
||||
|
||||
.ant-layout-sider-trigger {
|
||||
color: @text-color-base;
|
||||
border-top: 1px solid @border-color-light;
|
||||
color: @text-color-base;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-layout-sider-zero-width-trigger {
|
||||
top: 40%;
|
||||
z-index: 10;
|
||||
top: 40%;
|
||||
}
|
||||
|
||||
& .ant-layout-sider-trigger {
|
||||
|
@@ -117,9 +117,9 @@
|
||||
const activePath = ref('');
|
||||
const childrenMenus = ref<Menu[]>([]);
|
||||
const openMenu = ref(false);
|
||||
const dragBarRef = ref<ElRef>(null);
|
||||
const sideRef = ref<ElRef>(null);
|
||||
const currentRoute = ref<Nullable<RouteLocationNormalized>>(null);
|
||||
const dragBarRef = ref(null);
|
||||
const sideRef = ref(null);
|
||||
const currentRoute = ref<RouteLocationNormalized | null>(null);
|
||||
|
||||
const { prefixCls } = useDesign('layout-mix-sider');
|
||||
const go = useGo();
|
||||
@@ -347,13 +347,13 @@
|
||||
@width: 80px;
|
||||
.@{prefix-cls} {
|
||||
position: fixed;
|
||||
z-index: @layout-mix-sider-fixed-z-index;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: @layout-mix-sider-fixed-z-index;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background-color: @sider-dark-bg-color;
|
||||
transition: all 0.2s ease 0s;
|
||||
background-color: @sider-dark-bg-color;
|
||||
|
||||
&-dom {
|
||||
height: 100%;
|
||||
@@ -363,9 +363,9 @@
|
||||
|
||||
&-logo {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: @header-height;
|
||||
padding-left: 0 !important;
|
||||
justify-content: center;
|
||||
|
||||
img {
|
||||
width: @logo-width;
|
||||
@@ -386,12 +386,12 @@
|
||||
|
||||
.@{prefix-cls}-module {
|
||||
&__item {
|
||||
font-weight: normal;
|
||||
color: rgb(0 0 0 / 65%);
|
||||
font-weight: normal;
|
||||
|
||||
&--active {
|
||||
color: @primary-color;
|
||||
background-color: unset;
|
||||
color: @primary-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -427,9 +427,9 @@
|
||||
background-color: @sider-dark-bg-color;
|
||||
|
||||
&__title {
|
||||
color: @white;
|
||||
border-bottom: none;
|
||||
border-bottom: 1px solid @border-color;
|
||||
color: @white;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -455,42 +455,42 @@
|
||||
&__item {
|
||||
position: relative;
|
||||
padding: 12px 0;
|
||||
transition: all 0.3s ease;
|
||||
color: rgb(255 255 255 / 65%);
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:hover {
|
||||
color: @white;
|
||||
}
|
||||
// &:hover,
|
||||
&--active {
|
||||
font-weight: 700;
|
||||
color: @white;
|
||||
background-color: @sider-dark-darken-bg-color;
|
||||
color: @white;
|
||||
font-weight: 700;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 3px;
|
||||
height: 100%;
|
||||
background-color: @primary-color;
|
||||
content: '';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__icon {
|
||||
margin-bottom: 8px;
|
||||
font-size: 24px;
|
||||
transition: all 0.2s;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
&__name {
|
||||
margin-bottom: 0;
|
||||
font-size: 12px;
|
||||
transition: all 0.2s;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -499,19 +499,19 @@
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
height: 36px;
|
||||
background-color: @trigger-dark-bg-color;
|
||||
color: rgb(255 255 255 / 65%);
|
||||
font-size: 14px;
|
||||
line-height: 36px;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
background-color: @trigger-dark-bg-color;
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
}
|
||||
|
||||
&.light &-trigger {
|
||||
color: rgb(0 0 0 / 65%);
|
||||
background-color: #fff;
|
||||
border-top: 1px solid #eee;
|
||||
background-color: #fff;
|
||||
color: rgb(0 0 0 / 65%);
|
||||
}
|
||||
|
||||
&-menu-list {
|
||||
@@ -519,25 +519,25 @@
|
||||
top: 0;
|
||||
width: 200px;
|
||||
height: calc(100%);
|
||||
background-color: #fff;
|
||||
transition: all 0.2s;
|
||||
background-color: #fff;
|
||||
|
||||
&__title {
|
||||
display: flex;
|
||||
height: @header-height;
|
||||
// margin-left: -6px;
|
||||
font-size: 18px;
|
||||
color: @primary-color;
|
||||
border-bottom: 1px solid rgb(238 238 238);
|
||||
opacity: 0%;
|
||||
transition: unset;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: @header-height;
|
||||
transition: unset;
|
||||
border-bottom: 1px solid rgb(238 238 238);
|
||||
opacity: 0;
|
||||
color: @primary-color;
|
||||
// margin-left: -6px;
|
||||
font-size: 18px;
|
||||
|
||||
&.show {
|
||||
min-width: 130px;
|
||||
opacity: 100%;
|
||||
transition: all 0.5s ease;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.pushpin {
|
||||
@@ -581,11 +581,11 @@
|
||||
right: -1px;
|
||||
width: 1px;
|
||||
height: calc(100% - 50px);
|
||||
cursor: ew-resize;
|
||||
background-color: #f8f8f9;
|
||||
border-top: none;
|
||||
border-bottom: none;
|
||||
background-color: #f8f8f9;
|
||||
box-shadow: 0 0 4px 0 rgb(28 36 56 / 15%);
|
||||
cursor: ew-resize;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@@ -140,5 +140,5 @@
|
||||
});
|
||||
</script>
|
||||
<style lang="less">
|
||||
@import './index.less';
|
||||
@import url('./index.less');
|
||||
</style>
|
||||
|
@@ -41,7 +41,9 @@ export function createPermissionGuard(router: Router) {
|
||||
next((to.query?.redirect as string) || '/');
|
||||
return;
|
||||
}
|
||||
} catch {}
|
||||
} catch {
|
||||
//
|
||||
}
|
||||
}
|
||||
next();
|
||||
return;
|
||||
|
@@ -30,7 +30,7 @@ export function getAppEnvConfig() {
|
||||
VITE_GLOB_UPLOAD_URL,
|
||||
} = ENV;
|
||||
|
||||
if (!/^[a-zA-Z\_]*$/.test(VITE_GLOB_APP_SHORT_NAME)) {
|
||||
if (!/^[a-zA-Z_]*$/.test(VITE_GLOB_APP_SHORT_NAME)) {
|
||||
warn(
|
||||
`VITE_GLOB_APP_SHORT_NAME Variables can only be characters/underscores, please modify in the environment variables and re-running.`,
|
||||
);
|
||||
|
@@ -194,10 +194,10 @@ export class VAxios {
|
||||
request<T = any>(config: AxiosRequestConfig, options?: RequestOptions): Promise<T> {
|
||||
let conf: CreateAxiosOptions = cloneDeep(config);
|
||||
// cancelToken 如果被深拷贝,会导致最外层无法使用cancel方法来取消请求
|
||||
if(config.cancelToken){
|
||||
conf.cancelToken = config.cancelToken
|
||||
if (config.cancelToken) {
|
||||
conf.cancelToken = config.cancelToken;
|
||||
}
|
||||
|
||||
|
||||
const transform = this.getTransform();
|
||||
|
||||
const { requestOptions } = this.options;
|
||||
|
@@ -10,7 +10,7 @@ export class AxiosRetry {
|
||||
retry(axiosInstance: AxiosInstance, error: AxiosError) {
|
||||
// @ts-ignore
|
||||
const { config } = error.response;
|
||||
const { waitTime, count } = config?.requestOptions?.retryRequest;
|
||||
const { waitTime, count } = config?.requestOptions?.retryRequest ?? {};
|
||||
config.__retryCount = config.__retryCount || 0;
|
||||
if (config.__retryCount >= count) {
|
||||
return Promise.reject(error);
|
||||
|
@@ -93,6 +93,6 @@ export const isServer = typeof window === 'undefined';
|
||||
export const isClient = !isServer;
|
||||
|
||||
export function isUrl(path: string): boolean {
|
||||
const reg = /^http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/;
|
||||
const reg = /^http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- ./?%&=]*)?/;
|
||||
return reg.test(path);
|
||||
}
|
||||
|
@@ -1,9 +1,8 @@
|
||||
// copy from element-plus
|
||||
|
||||
import { warn } from 'vue';
|
||||
import { isObject } from '@vue/shared';
|
||||
import { fromPairs } from 'lodash-es';
|
||||
import type { ExtractPropTypes, PropType } from '@vue/runtime-core';
|
||||
import { fromPairs, isObject } from 'lodash-es';
|
||||
import type { ExtractPropTypes, PropType } from 'vue';
|
||||
import type { Mutable } from './types';
|
||||
|
||||
const wrapperKey = Symbol();
|
||||
|
@@ -82,8 +82,8 @@
|
||||
<style scoped>
|
||||
.container {
|
||||
display: flex;
|
||||
width: 100vw;
|
||||
align-items: center;
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
.cropper-container {
|
||||
|
@@ -25,14 +25,14 @@
|
||||
.lazy-base-demo {
|
||||
&-wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 50%;
|
||||
height: 2000px;
|
||||
margin: 20px auto;
|
||||
text-align: center;
|
||||
background-color: @component-background;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&-box {
|
||||
@@ -47,12 +47,12 @@
|
||||
}
|
||||
|
||||
.custom-enter {
|
||||
opacity: 0%;
|
||||
transform: scale(0.4) translate(100%);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.custom-enter-to {
|
||||
opacity: 100%;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.custom-enter-active {
|
||||
@@ -63,12 +63,12 @@
|
||||
}
|
||||
|
||||
.custom-leave {
|
||||
opacity: 100%;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.custom-leave-to {
|
||||
opacity: 0%;
|
||||
transform: scale(0.4) translate(-100%);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.custom-leave-active {
|
||||
|
@@ -29,14 +29,14 @@
|
||||
.lazy-base-demo {
|
||||
&-wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 50%;
|
||||
height: 2000px;
|
||||
margin: 20px auto;
|
||||
text-align: center;
|
||||
background-color: @component-background;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&-box {
|
||||
|
@@ -29,8 +29,8 @@
|
||||
|
||||
import { Divider } from 'ant-design-vue';
|
||||
import { PageWrapper } from '/@/components/Page';
|
||||
const data: Recordable[] = (() => {
|
||||
const arr: Recordable[] = [];
|
||||
const data = (() => {
|
||||
const arr: any[] = [];
|
||||
for (let index = 1; index < 20000; index++) {
|
||||
arr.push({
|
||||
title: '列表项' + index,
|
||||
@@ -49,16 +49,16 @@
|
||||
.virtual-scroll-demo {
|
||||
&-wrap {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin: 0 30%;
|
||||
background-color: @component-background;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
&__item {
|
||||
height: 40px;
|
||||
padding: 0 20px;
|
||||
line-height: 40px;
|
||||
border-bottom: 1px solid @border-color-base;
|
||||
line-height: 40px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@@ -26,7 +26,7 @@
|
||||
<style lang="less" scoped>
|
||||
.demo-wrap {
|
||||
width: 50%;
|
||||
background-color: @component-background;
|
||||
border-radius: 10px;
|
||||
background-color: @component-background;
|
||||
}
|
||||
</style>
|
||||
|
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user