perf(i18n): merge common lang

vben
1 parent fb57cf73
Showing 47 changed files with 175 additions and 102 deletions
package.json
src/components/Application/src/search/AppSearch.vue
src/components/Application/src/search/AppSearchFooter.vue
src/components/Application/src/search/AppSearchModal.vue
src/components/Application/src/search/useMenuSearch.ts
src/components/Button/src/PopConfirmButton.vue
src/components/Drawer/src/BasicDrawer.vue
src/components/Drawer/src/props.ts
src/components/Form/src/components/FormAction.vue
src/components/Form/src/helper.ts
src/components/MenuPlus/index.ts
src/components/MenuPlus/src/index.vue
src/components/Modal/src/BasicModal.vue
src/components/Modal/src/props.ts
src/components/Preview/src/index.vue
src/components/Table/src/components/settings/ColumnSetting.vue
src/components/Table/src/components/settings/RedoSetting.vue
src/layouts/default/setting/components/SettingFooter.vue
src/layouts/default/tabs/components/TabRedo.vue
src/layouts/default/tabs/useTabDropdown.ts
@@ -96,7 +96,7 @@
     "stylelint-order": "^4.1.0",
     "ts-node": "^9.1.0",
     "typescript": "^4.1.3",
-    "vite": "^2.0.0-beta.22",
+    "vite": "^2.0.0-beta.23",
     "vite-plugin-html": "^2.0.0-beta.5",
     "vite-plugin-mock": "^2.0.0-beta.3",
     "vite-plugin-purge-icons": "^0.5.0",
 <template>
   <div :class="prefixCls" v-if="getShowSearch" @click.stop="handleSearch">
     <Tooltip>
-      <template #title> {{ t('component.app.search') }} </template>
+      <template #title> {{ t('common.searchText') }} </template>
       <SearchOutlined />
     </Tooltip>
@@ -15,7 +15,7 @@
     <span :class="`${prefixCls}__item`">
       <g-icon icon="mdi:keyboard-esc" />
     </span>
-    <span>{{ t('component.app.toClose') }}</span>
+    <span>{{ t('common.closeText') }}</span>
   </div>
 </template>
 <script lang="ts">
@@ -47,7 +47,7 @@
     font-size: 12px;
     color: #666;
     background: rgb(255 255 255);
-    border-radius: 0 0 8px 8px;
+    border-radius: 0 0 16px 16px;
     box-shadow: 0 -1px 0 0 #e0e3e8, 0 -3px 6px 0 rgba(69, 98, 155, 0.12);
     align-items: center;
     flex-shrink: 0;
@@ -7,7 +7,7 @@
             <div :class="`${prefixCls}-input__wrapper`">
               <a-input
                 :class="`${prefixCls}-input`"
-                :placeholder="t('component.app.search')"
+                :placeholder="t('common.searchText')"
                 allow-clear
                 @change="handleSearch"
               >
@@ -16,7 +16,7 @@
                 </template>
               </a-input>
               <span :class="`${prefixCls}-cancel`" @click="handleClose">{{
-                t('component.app.cancel')
+                t('common.cancelText')
               }}</span>
             </div>
@@ -116,6 +116,7 @@
         scrollWrap,
         handleMouseenter,
         handleClose: () => {
+          searchResult.value = [];
           emit('close');
         },
       };
@@ -135,7 +136,7 @@
     height: 100%;
     padding-top: 50px;
     // background: #656c85cc;
-    background: rgba(0, 0, 0, 0.8);
+    background: rgba(0, 0, 0, 0.25);
     justify-content: center;
     // backdrop-filter: blur(2px);
@@ -178,12 +179,13 @@
     &-content {
       position: relative;
-      width: 532px;
+      width: 632px;
       // padding: 14px;
       margin: 0 auto auto auto;
       background: #f5f6f7;
-      border-radius: 6px;
-      box-shadow: inset 1px 1px 0 0 hsla(0, 0%, 100%, 0.5), 0 3px 8px 0 #555a64;
+      border-radius: 16px;
+      box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
+      // box-shadow: inset 1px 1px 0 0 hsla(0, 0%, 100%, 0.5), 0 3px 8px 0 #555a64;
       flex-direction: column;
     }
@@ -196,9 +198,10 @@
     &-input {
       width: 100%;
-      height: 56px;
+      height: 48px;
       font-size: 1.5em;
       color: #1c1e21;
+      border-radius: 6px;
       span[role='img'] {
         color: #999;
 import { cloneDeep } from 'lodash-es';
-import { ref, onBeforeMount, unref, Ref } from 'vue';
+import { ref, onBeforeMount, unref, Ref, nextTick } from 'vue';
 import { useI18n } from '/@/hooks/web/useI18n';
 import { getMenus } from '/@/router/menus';
 import type { Menu } from '/@/router/types';
@@ -130,7 +130,7 @@ export function useMenuSearch(refs: Ref&lt;HTMLElement[]&gt;, scrollWrap: Ref&lt;ElRef&gt;, 
     start();
   }
-  function handleEnter() {
+  async function handleEnter() {
     if (!searchResult.value.length) return;
     const result = unref(searchResult);
     const index = unref(activeIndex);
@@ -139,10 +139,12 @@ export function useMenuSearch(refs: Ref&lt;HTMLElement[]&gt;, scrollWrap: Ref&lt;ElRef&gt;, 
     }
     const to = result[index];
     handleClose();
+    await nextTick();
     go(to.path);
   }
   function handleClose() {
+    searchResult.value = [];
     emit('close');
   }
 <script lang="ts">
-  import { defineComponent, h, unref } from 'vue';
+  import { defineComponent, h, unref, computed } from 'vue';
   import { Popconfirm } from 'ant-design-vue';
   import BasicButton from './BasicButton.vue';
@@ -7,7 +7,6 @@
   import { useI18n } from '/@/hooks/web/useI18n';
   import { extendSlots } from '/@/utils/helper/tsxHelper';
   import { omit } from 'lodash-es';
-  const { t } = useI18n();
   export default defineComponent({
     name: 'PopButton',
@@ -15,19 +14,29 @@
     components: { Popconfirm, BasicButton },
     props: {
       enable: propTypes.bool.def(true),
-      okText: propTypes.string.def(t('component.drawer.okText')),
-      cancelText: propTypes.string.def(t('component.drawer.cancelText')),
+      okText: propTypes.string,
+      cancelText: propTypes.string,
     },
     setup(props, { slots, attrs }) {
-      return () => {
-        const popValues = { ...props, ...unref(attrs) };
+      const { t } = useI18n();
+      const getBindValues = computed(() => {
+        const popValues = Object.assign(
+          {
+            okText: t('common.okText'),
+            cancelText: t('common.cancelText'),
+          },
+          { ...props, ...unref(attrs) }
+        );
+        return popValues;
+      });
+      return () => {
         const Button = h(BasicButton, omit(unref(attrs), 'icon'), extendSlots(slots));
         if (!props.enable) {
           return Button;
         }
-        return h(Popconfirm, omit(popValues, 'icon'), { default: () => Button });
+        return h(Popconfirm, omit(unref(getBindValues), 'icon'), { default: () => Button });
       };
     },
   });
@@ -16,7 +16,7 @@
     <ScrollContainer
       :style="getScrollContentStyle"
       v-loading="getLoading"
-      :loading-tip="loadingText || t('component.drawer.loadingText')"
+      :loading-tip="loadingText || t('common.loadingText')"
     >
       <slot />
     </ScrollContainer>
@@ -11,13 +11,13 @@ export const footerProps = {
    */
   showCancelBtn: propTypes.bool.def(true),
   cancelButtonProps: Object as PropType<Recordable>,
-  cancelText: propTypes.string.def(t('component.drawer.cancelText')),
+  cancelText: propTypes.string.def(t('common.cancelText')),
   /**
    * @description: Show confirmation button
    */
   showOkBtn: propTypes.bool.def(true),
   okButtonProps: Object as PropType<Recordable>,
-  okText: propTypes.string.def(t('component.drawer.okText')),
+  okText: propTypes.string.def(t('common.okText')),
   okType: propTypes.string.def('primary'),
   showFooter: propTypes.bool,
   footerHeight: {
@@ -101,7 +101,7 @@
         (): ButtonOptions => {
           return Object.assign(
             {
-              text: t('component.form.resetButton'),
+              text: t('common.resetText'),
             },
             props.resetButtonOptions
           );
@@ -111,7 +111,7 @@
       const getSubmitBtnOptions = computed(() => {
         return Object.assign(
           {
-            text: t('component.form.submitButton'),
+            text: t('common.queryText'),
           },
           props.submitButtonOptions
         );
@@ -10,10 +10,10 @@ const { t } = useI18n();
  */
 export function createPlaceholderMessage(component: ComponentType) {
   if (component.includes('Input') || component.includes('Complete')) {
-    return t('component.form.input');
+    return t('common.inputText');
   }
   if (component.includes('Picker')) {
-    return t('component.form.choose');
+    return t('common.chooseText');
   }
   if (
     component.includes('Select') ||
@@ -23,7 +23,7 @@ export function createPlaceholderMessage(component: ComponentType) {
     component.includes('Switch')
   ) {
     // return `请选择${label}`;
-    return t('component.form.choose');
+    return t('common.chooseText');
   }
   return '';
 }
+export { default as Menu } from './src/index.vue';
+<template>
+  <ul :class="getClass" :style="getStyle">
+    <slot></slot>
+  </ul>
+</template>
+
+<script lang="ts">
+  import { defineComponent, ref, computed, CSSProperties, unref } from 'vue';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import { propTypes } from '/@/utils/propTypes';
+  export default defineComponent({
+    props: {
+      mode: propTypes.oneOf(['horizontal', 'vertical']).def('vertical'),
+      theme: propTypes.oneOf(['light', 'dark', 'primary']).def('light'),
+      activeName: propTypes.oneOfType([propTypes.string, propTypes.number]),
+      openNames: propTypes.array.def([]),
+      accordion: propTypes.bool,
+      width: propTypes.string.def('210px'),
+    },
+    setup(props) {
+      const currentActiveName = ref(props.activeName);
+      const openedNames = ref<string[]>();
+
+      const { prefixCls } = useDesign('menu');
+
+      const getClass = computed(() => {
+        const { theme, mode } = props;
+        let curTheme = theme;
+        if (mode === 'vertical' && theme === 'primary') {
+          curTheme = 'light';
+        }
+        return [
+          prefixCls,
+          `${prefixCls}-${curTheme}`,
+          {
+            [`${prefixCls}-${mode}`]: mode,
+          },
+        ];
+      });
+
+      const getStyle = computed(
+        (): CSSProperties => {
+          const { mode, width } = props;
+          if (mode === 'vertical') {
+            return {
+              width: width,
+            };
+          }
+          return {};
+        }
+      );
+
+      function updateActiveName() {
+        if (unref(currentActiveName) === undefined) {
+          currentActiveName.value = -1;
+        }
+      }
+
+      function updateOpened() {}
+
+      return { getClass, getStyle };
+    },
+  });
+</script>
@@ -127,6 +127,7 @@
       watchEffect(() => {
         visibleRef.value = !!props.visible;
+        fullScreenRef.value = !!props.defaultFullscreen;
       });
       watch(
@@ -13,13 +13,14 @@ export const modalProps = {
   // open drag
   draggable: propTypes.bool.def(true),
   centered: propTypes.bool,
-  cancelText: propTypes.string.def(t('component.modal.cancelText')),
-  okText: propTypes.string.def(t('component.modal.okText')),
+  cancelText: propTypes.string.def(t('common.cancelText')),
+  okText: propTypes.string.def(t('common.okText')),
   closeFunc: Function as PropType<() => Promise<boolean>>,
 };
 export const basicProps = Object.assign({}, modalProps, {
+  defaultFullscreen: propTypes.bool,
   // Can it be full screen
   canFullscreen: propTypes.bool.def(true),
   // After enabling the wrapper, the bottom can be increased in height
@@ -21,9 +21,26 @@
   import { Image } from 'ant-design-vue';
   import { useDesign } from '/@/hooks/web/useDesign';
   import { propTypes } from '/@/utils/propTypes';
-  import { ImageItem } from './types';
   import { isString } from '/@/utils/is';
+  interface ImageProps {
+    alt?: string;
+    fallback?: string;
+    src: string;
+    width: string | number;
+    height?: string | number;
+    placeholder?: string | boolean;
+    preview?:
+      | boolean
+      | {
+          visible?: boolean;
+          onVisibleChange?: (visible: boolean, prevVisible: boolean) => void;
+          getContainer: string | HTMLElement | (() => HTMLElement);
+        };
+  }
+
+  type ImageItem = string | ImageProps;
+
   export default defineComponent({
     name: 'ImagePreview',
     components: {
@@ -33,7 +33,7 @@
           </Checkbox>
           <a-button size="small" type="link" @click="reset">
-            {{ t('component.table.settingReset') }}
+            {{ t('common.resetText') }}
           </a-button>
         </div>
       </template>
 <template>
   <Tooltip placement="top">
     <template #title>
-      <span>{{ t('component.table.settingRedo') }}</span>
+      <span>{{ t('common.redo') }}</span>
     </template>
     <RedoOutlined @click="redo" />
   </Tooltip>
@@ -7,7 +7,7 @@
     <a-button color="warning" block @click="handleResetSetting" class="my-3">
       <RedoOutlined class="mr-2" />
-      {{ t('layout.setting.resetBtn') }}
+      {{ t('common.resetText') }}
     </a-button>
     <a-button color="error" block @click="handleClearAndRedo">
 <template>
-  <Tooltip :title="t('layout.multipleTab.tooltipRedo')" placement="bottom" :mouseEnterDelay="0.5">
+  <Tooltip :title="t('common.redo')" placement="bottom" :mouseEnterDelay="0.5">
     <span :class="`${prefixCls}__extra-redo`" @click="handleRedo">
       <RedoOutlined :spin="loading" />
     </span>
@@ -51,7 +51,7 @@ export function useTabDropdown(tabContentProps: TabContentProps) {
       {
         icon: 'ion:reload-sharp',
         event: MenuEventEnum.REFRESH_PAGE,
-        text: t('layout.multipleTab.redo'),
+        text: t('layout.multipleTab.reload'),
         disabled: refreshDisabled,
       },
       {
+export default {
+  okText: 'OK',
+  closeText: 'Close',
+  cancelText: 'Cancel',
+  loadingText: 'Loading...',
+  saveText: 'Save',
+  delText: 'Delete',
+  resetText: 'Reset',
+  searchText: 'Search',
+  queryText: 'Search',
+
+  inputText: 'Please enter',
+  chooseText: 'Please choose',
+
+  redo: 'Refresh',
+  back: 'Back',
+};
 export default {
-  search: 'Search',
-  cancel: 'Cancel',
   searchNotData: 'No search results yet',
   toSearch: 'to search',
   toNavigate: 'to navigate',
-  toClose: 'to close',
-
-  okText: 'Confirm',
-  cancelText: 'Cancel',
 };
-export default {
-  loadingText: 'Loading...',
-  cancelText: 'Close',
-  okText: 'Confirm',
-};
 export default {
-  resetButton: 'Reset',
-  submitButton: 'Search',
   putAway: 'Put away',
   unfold: 'Unfold',
-  input: 'Please Input ',
-  choose: 'Please Choose ',
-
   maxTip: 'The number of characters should be less than {0}',
   apiSelectNotFound: 'Wait for data loading to complete...',
-export default {
-  search: 'Menu search',
-};
-export default {
-  cancelText: 'Close',
-  okText: 'Confirm',
-};
 export default {
-  settingRedo: 'Refresh',
   settingDens: 'Density',
   settingDensDefault: 'Default',
   settingDensMiddle: 'Middle',
@@ -8,7 +7,6 @@ export default {
   settingColumnShow: 'Column display',
   settingIndexColumnShow: 'Index Column',
   settingSelectColumnShow: 'Selection Column',
-  settingReset: 'Reset',
   settingFixedLeft: 'Fixed Left',
   settingFixedRight: 'Fixed Right',
   settingFullScreen: 'Full Screen',
@@ -3,7 +3,6 @@ export default {
   dropdownItemDoc: 'Document',
   dropdownItemLoginOut: 'Login Out',
-  search: 'Search',
   tooltipErrorLog: 'Error log',
   tooltipLock: 'Lock screen',
   tooltipNotify: 'Notification',
@@ -5,5 +5,4 @@ export default {
   closeRight: 'Close Right',
   closeOther: 'Close Other',
   closeAll: 'Close All',
-  tooltipRedo: 'Refresh',
 };
@@ -26,7 +26,6 @@ export default {
   resetSuccess: 'Successfully reset!',
   copyBtn: 'Copy',
-  resetBtn: 'Reset',
   clearBtn: 'Clear cache and to the login page',
   drawerTitle: 'Configuration',
 export default {
   backLogin: 'Back Login',
   backHome: 'Back Home',
-  redo: 'Refresh',
   subTitle403: "Sorry, you don't have access to this page.",
   subTitle404: 'Sorry, the page you visited does not exist.',
   subTitle500: 'Sorry, the server is reporting an error.',
@@ -2,7 +2,6 @@ export default {
   unlock: 'Click to unlock',
   alert: 'Lock screen password error',
   backToLogin: 'Back to login',
-  back: 'Back',
   entry: 'Enter the system',
   placeholder: 'Please enter the lock screen password or user password',
 };
+export default {
+  okText: '确认',
+  closeText: '关闭',
+  cancelText: '取消',
+  loadingText: '加载中...',
+  saveText: '保存',
+  delText: '删除',
+  resetText: '重置',
+  searchText: '搜索',
+  queryText: '查询',
+
+  inputText: '请输入',
+  chooseText: '请选择',
+
+  redo: '刷新',
+  back: '返回',
+};
 export default {
-  search: '搜索',
-  cancel: '取消',
   searchNotData: '暂无搜索结果',
   toSearch: '确认',
   toNavigate: '切换',
-  toClose: '关闭',
-  okText: '确认',
-  cancelText: '取消',
 };
-export default {
-  loadingText: '加载中...',
-  cancelText: '关闭',
-  okText: '确认',
-};
 export default {
-  resetButton: '重置',
-  submitButton: '查询',
   putAway: '收起',
   unfold: '展开',
-  input: '请输入',
-  choose: '请选择',
-
   maxTip: '字符数应小于{0}位',
   apiSelectNotFound: '请等待数据加载完成...',
-export default {
-  search: '菜单搜索',
-};
-export default {
-  cancelText: '关闭',
-  okText: '确认',
-};
 export default {
-  settingRedo: '刷新',
   settingDens: '密度',
   settingDensDefault: '默认',
   settingDensMiddle: '中等',
   settingDensSmall: '紧凑',
   settingColumn: '列设置',
   settingColumnShow: '列展示',
-  settingReset: '重置',
   settingIndexColumnShow: '序号列',
   settingSelectColumnShow: '勾选列',
   settingFixedLeft: '固定到左侧',
@@ -4,7 +4,6 @@ export default {
   dropdownItemLoginOut: '退出系统',
   // tooltip
-  search: '搜索',
   tooltipErrorLog: '错误日志',
   tooltipLock: '锁定屏幕',
   tooltipNotify: '消息通知',
 export default {
-  redo: '重新加载',
+  reload: '重新加载',
   close: '关闭标签页',
   closeLeft: '关闭左侧标签页',
   closeRight: '关闭右侧标签页',
   closeOther: '关闭其它标签页',
   closeAll: '关闭全部标签页',
-  tooltipRedo: '刷新',
 };
@@ -25,7 +25,6 @@ export default {
   resetSuccess: '重置成功！',
   copyBtn: '拷贝',
-  resetBtn: '重置',
   clearBtn: '清空缓存并返回登录页',
   drawerTitle: '项目配置',
 export default {
   backLogin: '返回登录',
   backHome: '返回首页',
-  redo: '刷新',
   subTitle403: '抱歉，您无权访问此页面。',
   subTitle404: '抱歉，您访问的页面不存在。',
   subTitle500: '抱歉，服务器报告错误。',
 export default {
   unlock: '点击解锁',
   alert: '锁屏密码错误',
-  back: '返回',
   backToLogin: '返回登录',
   entry: '进入系统',
   placeholder: '请输入锁屏密码或者用户密码',
@@ -97,7 +97,7 @@ export default defineComponent({
     unref(statusMapRef).set(ExceptionEnum.PAGE_NOT_DATA, {
       title: t('sys.exception.noDataTitle'),
       subTitle: '',
-      btnText: t('sys.exception.redo'),
+      btnText: t('common.redo'),
       handler: () => redo(),
       icon: notDataImg,
     });
@@ -31,7 +31,7 @@
               :disabled="loadingRef"
               @click="handleShowForm(true)"
             >
-              {{ t('sys.lock.back') }}
+              {{ t('common.back') }}
             </a-button>
             <a-button
               type="link"
@@ -7835,10 +7835,10 @@ vite-plugin-pwa@^0.3.5:
     pretty-bytes "^5.5.0"
     workbox-build "^6.0.2"
-vite@^2.0.0-beta.22:
-  version "2.0.0-beta.22"
-  resolved "https://registry.npmjs.org/vite/-/vite-2.0.0-beta.22.tgz#c33a4689fe1659bfdc87a36b9e8527baea0e3119"
-  integrity sha512-Mj9qTSYx0625htRTClQV4OLQhjhujgHCV/FStGNu8G9NcHp3MP56gc6+UoRgQzrAsK8HI9MKfcW+NFgljoJKyA==
+vite@^2.0.0-beta.23:
+  version "2.0.0-beta.23"
+  resolved "https://registry.npmjs.org/vite/-/vite-2.0.0-beta.23.tgz#9cbbfc85c5737f5bdee4784c7b838365852396f7"
+  integrity sha512-vrQ56VBUCSjNFgx6DapDXMo6fkW2s3S7zmxWCIEE2ZiAbxoTQCic+NveTiMRA4+JF29ZQf00tzsAri6BIzi9VA==
   dependencies:
     esbuild "^0.8.26"
     postcss "^8.2.1"