ci: add ls-lint

.ls-lint.yml

@@ -0,0 +1,20 @@
+ls:
+  src/*:
+    .js: kebab-case | PascalCase
+    .vue: PascalCase | regex:^index
+    .ts: camelCase | PascalCase
+    .d.ts: kebab-case
+    .mock.ts: kebab-case
+    .data.ts: camelCase | kebab-case
+    .test-d.ts: kebab-case
+    .spec.ts: camelCase | PascalCase
+    .mock.ts: camelCase
+
+ignore:
+  - node_modules
+  - .git
+  - .circleci
+  - .github
+  - .vscode
+  - dist
+  - .local

build/npm-hook/postinstall.js

@@ -6,7 +6,6 @@
 
 // /**
 //  * @description: 判断是否装了cnpm
-//  * @Date: 2020-06-10 13:46:40
 //  */
 // function isInstallCnpm() {
 //   return new Promise((resolve) => {
@@ -16,7 +15,6 @@
 // }
 // /**
 //  * @description: 尝试安装cnpm
-//  * @Date: 2020-06-10 13:47:05
 //  */
 // function tryInstallCnpm() {
 //   return new Promise((resolve) => {
@@ -30,7 +28,6 @@
 // }
 // /**
 //  * @description: 安装插件
-//  * @Date: 2020-06-10 13:46:47
 //  */
 // async function installImageWebpack() {
 //   const installCnpm = await isInstallCnpm();
@@ -49,7 +46,6 @@
 
 // /**
 //  * @description: 使git对文件名大小写敏感
-//  * @Date: 2020-06-11 11:07:04
 //  */
 // function ignoreCaseGit() {
 //   exec('git config core.ignorecase false ');

build/npm-hook/preinstall.js

@@ -1,3 +1,14 @@
+const shelljs = require('shelljs');
+const { exec } = shelljs;
+
+/**
+ * @description: 使git对文件名大小写敏感
+ */
+function ignoreCaseGit() {
+  exec('git config core.ignorecase false ');
+}
+ignoreCaseGit();
+
 // 安装之前先行删除image-webpack-loader,防止yarn 安装失败
 
 // const { join } = require('path');

package.json

@@ -27,6 +27,7 @@
     "clean:cache": "npx rimraf node_modules/.cache/",
     "clean:lib": "npx rimraf node_modules",
     "test:unit": "vue-cli-service test:unit",
+    "ls-lint": "npx ls-lint",
     "lint": "cross-env --max_old_space_size=4096 vue-cli-service lint --mode=production --fix",
     "lint:eslint": "cross-env --max_old_space_size=4096 eslint --fix --ext \"src/**/*.{vue,less,css,scss}\"",
     "lint:stylelint": "cross-env --max_old_space_size=4096 stylelint  --fix \"**/*.{vue,less,css,scss}\" --cache --cache-location node_modules/.cache/stylelint/",
@@ -69,6 +70,7 @@
     "@commitlint/cli": "^9.1.1",
     "@commitlint/config-conventional": "^9.1.1",
     "@gfx/zopfli": "^1.0.14",
+    "@ls-lint/ls-lint": "^1.9.0",
     "@types/echarts": "^4.6.3",
     "@types/qrcode": "^1.3.4",
     "@types/tinymce": "^4.5.24",
@@ -165,7 +167,7 @@
   "homepage": "https://github.com/anncwb/vue-vben-admin",
   "husky": {
     "hooks": {
-      "pre-commit": "lint-staged",
+      "pre-commit": "ls-lint && lint-staged",
       "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
     }
   },

src/components/table/index.ts

@@ -5,4 +5,4 @@ export { useTable } from './src/hooks/useTable';
 export { FormSchema, FormProps } from '@/components/form/src/types/form';
 export * from './src/types/table';
 export * from './src/types/pagination';
-export * from './src/types/table-action';
+export * from './src/types/tableAction';

src/components/table/src/components/TableAction.vue

@@ -4,7 +4,7 @@
   import { Icon } from '@/components/icon/index';
   import { useDesign } from '@/hooks/core/useDesign';
 
-  import { ActionItem } from '../types/table-action';
+  import { ActionItem } from '../types/tableAction';
   export default defineComponent({
     name: 'TableAction',
     props: {

src/components/transition/index.ts

@@ -1,7 +1,7 @@
 import { getAsyncComponent, transformComponents } from '@/common/factory/getAsyncComponent';
 import { createSimpleTransition, createJavascriptTransition } from './src/createTransition';
 
-import ExpandTransitionGenerator from './src/expand-transition';
+import ExpandTransitionGenerator from './src/expandTransition';
 
 // export { default as CollapseTransition } from './src/Collapse.vue';
 

src/hooks/event/useElResize.ts

@@ -1,7 +1,7 @@
 import { Fn } from './types';
 
 import { useDebounce } from '@/hooks/core/useDebounce';
-import { addResizeListener, removeResizeListener } from '@/utils/event/resize-event';
+import { addResizeListener, removeResizeListener } from '@/utils/event/resizeEvent';
 
 interface WindowSizeOptions {
   once?: boolean;

src/layouts/default/LayoutHeader.vue

@@ -6,7 +6,7 @@
   import Logo from '@/layouts/Logo.vue';
   import LayoutBread from './LayoutBread.vue';
 
-  import LockAction from './actions/lockAction.vue';
+  import LockAction from './actions/LockAction.vue';
   import GithubModal from './actions/GithubModal.vue';
   import { useModal } from '@/components/modal/index';
 

src/layouts/default/actions/LockAction.vue

@@ -0,0 +1,135 @@
+<script lang="tsx">
+  // 组件相关
+  import { defineComponent, unref } from 'compatible-vue';
+  import { SvgIcon } from '@/components/icon/index';
+  import { Button, Icon } from 'ant-design-vue';
+  import { BasicModal, useModalExt } from '@/components/modal/index';
+
+  // hook
+  import { useDesign } from '@/hooks/core/useDesign';
+  import { BasicForm, useForm } from '@/components/form/index';
+
+  import headerImg from '@/assets/images/header.jpg';
+
+  import { appStore } from '@/store/modules/app';
+  import { userStore } from '@/store/modules/user';
+  export default defineComponent({
+    name: 'LockModal',
+    setup(_, { listeners, emit }) {
+      const { register: registerModal, modalInstallRef } = useModalExt(emit);
+      // 样式前缀
+      const { prefixCls } = useDesign('lock-modal');
+      const [register, { validateFields, resetFields }] = useForm({
+        // 隐藏按钮
+        showActionButtonGroup: false,
+        // 表单项
+        schemas: [
+          {
+            field: 'password',
+            label: '锁屏密码',
+            component: 'InputPassword',
+            componentProps: {
+              placeholder: '请输入锁屏密码',
+            },
+            rules: [{ required: true }],
+            renderComponentContent: () => {
+              return [<SvgIcon type="password" slot="addonBefore" />];
+            },
+          },
+        ],
+      });
+      /**
+       * @description: lock
+       */
+      async function lock(valid = true) {
+        let password: string | undefined = '';
+        if (valid) {
+          const { err, values } = await validateFields();
+          if (err) {
+            return;
+          }
+          password = values.password;
+        } else {
+          password = undefined;
+        }
+
+        unref(modalInstallRef)!.setModalProps({
+          visible: false,
+        });
+
+        appStore.commitLockInfoState({
+          isLock: true,
+          pwd: password,
+        });
+        resetFields();
+      }
+      // 账号密码登录
+      return () => (
+        <BasicModal
+          class={prefixCls}
+          footer={null}
+          title="锁定屏幕"
+          on={{
+            ...listeners,
+            register: registerModal,
+          }}
+        >
+          <div class={`${prefixCls}__entry`}>
+            <div class={`${prefixCls}__header`}>
+              <img src={headerImg} class={`${prefixCls}__header-img`} />
+              <p class={`${prefixCls}__header-name`}>{userStore.getUserInfoState.realName}</p>
+            </div>
+            <BasicForm onRegister={register} />
+            <div class={`${prefixCls}__footer`}>
+              <Button type="primary" block class="mt-2" onClick={lock}>
+                <Icon type="lock" />
+                锁屏
+              </Button>
+              <Button block class="mt-2" onClick={lock.bind(null, false)}>
+                <Icon type="lock" />
+                不设置密码锁屏
+              </Button>
+            </div>
+          </div>
+        </BasicModal>
+      );
+    },
+  });
+</script>
+<style lang="less" scoped>
+  @import (reference) '~@design';
+
+  @prefix-cls: ~'@{namespace}-lock-modal';
+
+  .@{prefix-cls} {
+    &__entry {
+      position: relative;
+      width: 500px;
+      height: 240px;
+      padding: 80px 30px 0 30px;
+      background: @white;
+      border-radius: 10px;
+    }
+
+    &__header {
+      position: absolute;
+      top: 0;
+      left: calc(50% - 45px);
+      width: auto;
+      text-align: center;
+
+      &-img {
+        width: 70px;
+        border-radius: 50%;
+      }
+
+      &-name {
+        margin-top: 5px;
+      }
+    }
+
+    &__footer {
+      text-align: center;
+    }
+  }
+</style>

src/views/Temp.vue

@@ -0,0 +1,20 @@
+<script lang="tsx">
+  import { defineComponent } from 'compatible-vue';
+  import { useDesign } from '@/hooks/core/useDesign';
+
+  export default defineComponent({
+    name: 'Index',
+    setup() {
+      const { prefixCls } = useDesign('index');
+      return () => <div class={prefixCls}>index</div>;
+    },
+  });
+</script>
+<style scoped lang="less">
+  @import (reference) '~@design';
+  @prefix-cls: ~'@{namespace}-index';
+
+  .@{prefix-cls} {
+    position: relative;
+  }
+</style>

yarn.lock

@@ -1213,6 +1213,11 @@
     "@types/istanbul-reports" "^1.1.1"
     "@types/yargs" "^13.0.0"
 
+"@ls-lint/ls-lint@^1.9.0":
+  version "1.9.0"
+  resolved "https://registry.npm.taobao.org/@ls-lint/ls-lint/download/@ls-lint/ls-lint-1.9.0.tgz#fa4637d34526e71aea7e5228426493a113f27d77"
+  integrity sha1-+kY300Um5xrqflIoQmSToRPyfXc=
+
 "@mrmlnc/readdir-enhanced@^2.2.1":
   version "2.2.1"
   resolved "https://registry.npm.taobao.org/@mrmlnc/readdir-enhanced/download/@mrmlnc/readdir-enhanced-2.2.1.tgz#524af240d1a360527b730475ecfa1344aa540dde"