mooho-base-admin-plus 0.1.70 → 0.4.2

package/src/layouts/basic-layout/header-breadcrumb/index.vue

@@ -8,7 +8,7 @@
       <i-menu-head-title :item="item" :hide-icon="!showBreadcrumbIcon" />
     </BreadcrumbItem>
     <BreadcrumbItem>
-      <i-menu-head-title :item="siderMenuObject[activePath]" :hide-icon="!showBreadcrumbIcon" />
+      <i-menu-head-title :item="currentTitle()" :hide-icon="!showBreadcrumbIcon" />
     </BreadcrumbItem>
   </Breadcrumb>
 </template>
@@ -43,7 +43,14 @@
         items.forEach(i => {
           newItems.push(this.siderMenuObject[i]);
         });
-        items = items.filter(item => item);
+
+        if (Setting.layout.showI18n) {
+          newItems.forEach(item => {
+            item.title = this.$t('Permission_' + item.code);
+          });
+        }
+
+        //items = items.filter(item => item);
         return newItems;
       },
       // 第一级，默认是 menu/header.js 中的第一项
@@ -51,7 +58,7 @@
         return Setting.info.title;
       },
       topItem() {
-        return this.header.find(item => item.name === this.headerName);
+        return Setting.layout.showI18n ? this.$t('Front_Label_Setting_Info_Title') : Setting.info.title;
       },
       // 得到所有侧边菜单，并转为平级，查询图标及显示对应内容
       allSiderMenu() {
@@ -84,6 +91,14 @@
             this.breadcrumbWidth = parseInt(getStyle($breadcrumb.$el, 'width'));
           }
         });
+      },
+      currentTitle() {
+        let item = this.siderMenuObject[this.activePath];
+        if (Setting.layout.showI18n && item) {
+          item.title = this.$t('Permission_' + item.code);
+        }
+
+        return item;
       }
     },
     watch: {

package/src/layouts/basic-layout/header-i18n/index.vue

@@ -5,16 +5,15 @@
     </span>
     <template #list>
       <DropdownMenu>
-        <DropdownItem v-for="item in languages" :key="item.locale" :name="item.locale" :selected="locale === item.locale">
-          <img v-if="item.icon" :src="item.icon" />
-          <span>{{ item.language }}</span>
+        <DropdownItem v-for="(item, key) in languages" :key="key" :name="key" :selected="locale === key">
+          <span>{{ item }}</span>
         </DropdownItem>
       </DropdownMenu>
     </template>
   </Dropdown>
 </template>
 <script>
-  import Setting from '../../../setting';
+  //import Setting from '../../../setting';
   import { mapState, mapActions } from 'vuex';
 
   export default {
@@ -27,11 +26,11 @@
     },
     data() {
       return {
-        languages: Setting.i18n.list
+        //languages: Setting.i18n.list
       };
     },
     computed: {
-      ...mapState('admin/i18n', ['locale']),
+      ...mapState('admin/i18n', ['locale', 'languages']),
       ...mapState('admin/layout', ['isMobile'])
     },
     methods: {

package/src/layouts/basic-layout/header-notice/index.vue

@@ -15,7 +15,7 @@
         </template>
 
         <NotificationTab
-          title="待办"
+          :title="$t('Front_Label_Todo')"
           name="task"
           :count="taskCount"
           :loaded-all="taskFilter.page * taskFilter.per >= taskCount"
@@ -35,7 +35,7 @@
           />
         </NotificationTab>
         <NotificationTab
-          title="通知"
+          :title="$t('Front_Label_Notification')"
           name="notification"
           :count="unreadCount"
           :loaded-all="notificationFilter.page * notificationFilter.per >= notificationCount"

package/src/layouts/basic-layout/header-search/index.vue

@@ -1,6 +1,6 @@
 <template>
   <span v-if="isDesktop" class="i-layout-header-trigger i-layout-header-trigger-min i-layout-header-trigger-in i-layout-header-trigger-nohover">
-    <input class="i-layout-header-search" type="text" :placeholder="$t('basicLayout.search.placeholder')" />
+    <input class="i-layout-header-search" type="text" :placeholder="$t('Front_Label_Search')" />
   </span>
   <Dropdown v-else trigger="click" class="i-layout-header-search-drop" ref="dropdown">
     <span class="i-layout-header-trigger i-layout-header-trigger-min">
@@ -10,10 +10,10 @@
       <DropdownMenu>
         <Row align="middle">
           <Col flex="auto" class="ivu-pl-4">
-            <Input size="large" prefix="ios-search" :placeholder="$t('basicLayout.search.placeholder')" />
+            <Input size="large" prefix="ios-search" :placeholder="$t('Front_Label_Search')" />
           </Col>
           <Col flex="80px" class="ivu-text-center">
-            <span @click="handleCloseSearch">{{ $t('basicLayout.search.cancel') }}</span>
+            <span @click="handleCloseSearch">{{ $t('Front_Btn_Cancel') }}</span>
           </Col>
         </Row>
       </DropdownMenu>

package/src/layouts/basic-layout/header-user/index.vue

@@ -9,13 +9,13 @@
           <DropdownItem>
             <label @click="resetPwdOpen">
               <Icon type="ios-lock" />
-              <span>修改密码</span>
+              <span>{{ $t('Front_Label_Change_Password') }}</span>
             </label>
           </DropdownItem>
           <DropdownItem>
             <label @click="$refs.form.open(info)">
               <Icon type="ios-contact" />
-              <span>个人信息</span>
+              <span>{{ $t('Front_Label_User_Info') }}</span>
             </label>
           </DropdownItem>
           <!-- <i-link to="/setting/user">
@@ -32,7 +32,7 @@
                 </i-link> -->
           <DropdownItem divided name="logout">
             <Icon type="ios-log-out" />
-            <span>{{ $t('basicLayout.user.logOut') }}</span>
+            <span>{{ $t('Front_Label_Logout') }}</span>
           </DropdownItem>
         </DropdownMenu>
       </template>
@@ -41,25 +41,25 @@
       <Modal v-model="resetPwdOpened" scrollable>
         <template #header>
           <div>
-            <span class="title">修改密码</span>
-            <span class="description">Change Password</span>
+            <span class="title">{{ $t('Front_Label_Change_Password') }}</span>
+            <span class="description">{{ $t('Front_Label_Change_Password_Desc') }}</span>
           </div>
         </template>
         <div class="ivu-ml-8 ivu-mr-8">
           <Form ref="resetPwdForm" :model="resetPwdData" :rules="resetPwdRule" label-position="top" label-colon="：" class="ivu-mt" @submit.prevent>
             <Row :gutter="24" type="flex">
               <Col v-bind="grid24">
-                <FormItem label="旧密码" key="oldPwd" prop="oldPwd">
+                <FormItem :label="$t('Front_Label_Old_Password')" key="oldPwd" prop="oldPwd">
                   <Input type="password" v-model="resetPwdData.oldPwd" />
                 </FormItem>
               </Col>
               <Col v-bind="grid24">
-                <FormItem label="新密码" key="newPwd" prop="newPwd">
+                <FormItem :label="$t('Front_Label_New_Password')" key="newPwd" prop="newPwd">
                   <Input type="password" v-model="resetPwdData.newPwd" />
                 </FormItem>
               </Col>
               <Col v-bind="grid24">
-                <FormItem label="确认新密码" key="checkPwd" prop="checkPwd">
+                <FormItem :label="$t('Front_Label_Confirm_Password')" key="checkPwd" prop="checkPwd">
                   <Input type="password" v-model="resetPwdData.checkPwd" />
                 </FormItem>
               </Col>
@@ -67,13 +67,13 @@
           </Form>
         </div>
         <template #footer>
-          <Button type="primary" custom-icon="fa fa-check" @click="submitChangePwd">保存</Button>
+          <Button type="primary" custom-icon="fa fa-check" @click="submitChangePwd">{{ $t('Front_Btn_Save') }}</Button>
         </template>
       </Modal>
     </template>
     <modal-form ref="form" view-code="UserInfoEdit">
       <template #footer>
-        <Button type="primary" custom-icon="fa fa-save" @click="submitUserInfo">保存</Button>
+        <Button type="primary" custom-icon="fa fa-save" @click="submitUserInfo">{{ $t('Front_Btn_Save') }}</Button>
       </template>
     </modal-form>
   </span>
@@ -95,19 +95,19 @@
           oldPwd: {
             type: 'string',
             required: true,
-            message: '请输入旧密码',
+            message: this.tParam('Front_Msg_Please_Input|' + this.$t('Front_Label_Old_Password')),
             trigger: 'blur,change'
           },
           newPwd: {
             type: 'string',
             required: true,
-            message: '请输入新密码',
+            message: this.tParam('Front_Msg_Please_Input|' + this.$t('Front_Label_New_Password')),
             trigger: 'blur,change'
           },
           checkPwd: {
             type: 'string',
             required: true,
-            message: '请重复新密码',
+            message: this.tParam('Front_Msg_Please_Input|' + this.$t('Front_Label_Confirm_Password')),
             trigger: 'blur,change'
           }
         }
@@ -143,17 +143,17 @@
         let isOK = await this.$refs.resetPwdForm.validate();
 
         if (!isOK) {
-          this.error('有内容不符合要求，请正确填写！');
+          this.error('Front_Msg_Form_Validate_Fail');
         } else {
           if (this.resetPwdData.newPwd != this.resetPwdData.checkPwd) {
-            this.error('两次新密码输入不一致！');
+            this.error('Front_Msg_Password_Inconsistent');
           } else {
             await userlApi.updatePassword({
               oldPassword: this.resetPwdData.oldPwd,
               newPassword: this.resetPwdData.newPwd
             });
 
-            this.success('修改成功!', () => {
+            this.success('Front_Msg_Success', () => {
               this.resetPwdOpened = false;
             });
           }
@@ -161,10 +161,10 @@
       },
       // 保存用户信息
       submitUserInfo() {
-        this.confirm('确定要保存吗？', async () => {
+        this.confirm('Front_Msg_Sure_To_Save', async () => {
           await userlApi.updateUser(this.$refs.form.data);
 
-          this.success('修改成功!', () => {
+          this.success('Front_Msg_Success', () => {
             this.set(this.$refs.form.data);
             this.$refs.form.opened = false;
           });

package/src/layouts/basic-layout/menu-side/index.vue

@@ -25,7 +25,13 @@
           <i-menu-side-submenu v-else :menu="item" :key="'submenu' + index" />
         </template>
         <template v-else>
-          <Tooltip :content="tTitle(item.title)" placement="right" v-if="item.children === undefined || !item.children.length" :key="index" :theme="siderTheme">
+          <Tooltip
+            :content="this.layout.showI18n ? this.$t('Permission_' + item.code) : item.title"
+            placement="right"
+            v-if="item.children === undefined || !item.children.length"
+            :key="index"
+            :theme="siderTheme"
+          >
             <i-menu-side-item class="i-layout-menu-side-collapse-top-item" :menu="item" hide-title />
           </Tooltip>
           <i-menu-side-collapse v-else :menu="item" top-level :key="'collapse' + index" />
@@ -42,7 +48,7 @@
   import iMenuSideItem from './menu-item.vue';
   import iMenuSideSubmenu from './submenu.vue';
   import iMenuSideCollapse from './menu-collapse.vue';
-  import tTitle from '../mixins/translate-title';
+  import mixinPage from '../../../mixins/page';
 
   // 元素是否在可视区域
   function isElementInViewport(el) {
@@ -57,7 +63,7 @@
 
   export default {
     name: 'iMenuSide',
-    mixins: [tTitle],
+    mixins: [mixinPage],
     components: { iMenuSideItem, iMenuSideSubmenu, iMenuSideCollapse },
     props: {
       hideLogo: {

package/src/layouts/basic-layout/menu-side/menu-title.vue

@@ -14,17 +14,18 @@
       }"
       v-if="!hideTitle"
     >
-      {{ tTitle(menu.title) }}
-      <em v-if="menu.subtitle">{{ tTitle(menu.subtitle) }}</em>
+      {{ this.layout.showI18n ? this.$t('Permission_' + menu.code) : menu.title }}
+      <em v-if="menu.subtitle">{{ this.layout.showI18n ? this.$t('Permission_' + menu.code + '_SubName') : menu.subTitle }}</em>
     </span>
   </span>
 </template>
 <script>
-  import tTitle from '../mixins/translate-title';
+  import mixinPage from '../../../mixins/page';
+  // import tTitle from '../mixins/translate-title';
 
   export default {
     name: 'iMenuSideTitle',
-    mixins: [tTitle],
+    mixins: [mixinPage],
     props: {
       menu: {
         type: Object,

package/src/layouts/basic-layout/mixins/click-item.js

@@ -1,21 +1,21 @@
-import { findComponentUpward } from 'view-ui-plus/src/utils/assist';
-import { mapState } from 'vuex';
-
-export default {
-  computed: {
-    ...mapState('admin/layout', ['menuSiderReload', 'menuHeaderReload'])
-  },
-  methods: {
-    handleClick(path, type = 'sider') {
-      const current = this.$route.path;
-      if (current === path) {
-        if (type === 'sider' && this.menuSiderReload) this.handleReload();
-        else if (type === 'header' && this.menuHeaderReload) this.handleReload();
-      }
-    },
-    handleReload() {
-      const $layout = findComponentUpward(this, 'BasicLayout');
-      if ($layout) $layout.handleReload();
-    }
-  }
-};
+import { findComponentUpward } from 'view-ui-plus/src/utils/assist';
+import { mapState } from 'vuex';
+
+export default {
+  computed: {
+    ...mapState('admin/layout', ['menuSiderReload', 'menuHeaderReload'])
+  },
+  methods: {
+    handleClick(path, type = 'sider') {
+      const current = this.$route.path;
+      if (current === path) {
+        if (type === 'sider' && this.menuSiderReload) this.handleReload();
+        else if (type === 'header' && this.menuHeaderReload) this.handleReload();
+      }
+    },
+    handleReload() {
+      const $layout = findComponentUpward(this, 'BasicLayout');
+      if ($layout) $layout.handleReload();
+    }
+  }
+};

package/src/layouts/basic-layout/mixins/sider-menu-badge.js

@@ -1,13 +1,13 @@
-import { mapState } from 'vuex';
-
-export default {
-  computed: {
-    ...mapState('admin/menu', ['siderMenuBadge']),
-    badgeData() {
-      let data = null;
-      const siderMenuBadge = this.siderMenuBadge.find(item => item.path === this.menu.path);
-      if (siderMenuBadge) data = siderMenuBadge;
-      return data;
-    }
-  }
-};
+import { mapState } from 'vuex';
+
+export default {
+  computed: {
+    ...mapState('admin/menu', ['siderMenuBadge']),
+    badgeData() {
+      let data = null;
+      const siderMenuBadge = this.siderMenuBadge.find(item => item.path === this.menu.path);
+      if (siderMenuBadge) data = siderMenuBadge;
+      return data;
+    }
+  }
+};

package/src/layouts/basic-layout/mixins/translate-title.js

@@ -1,11 +1,11 @@
-export default {
-  methods: {
-    tTitle(title) {
-      if (title && title.indexOf('$t:') === 0) {
-        return this.$t(title.split('$t:')[1]);
-      } else {
-        return title;
-      }
-    }
-  }
-};
+export default {
+  methods: {
+    tTitle(title) {
+      if (title && title.indexOf('$t:') === 0) {
+        return this.$t(title.split('$t:')[1]);
+      } else {
+        return title;
+      }
+    }
+  }
+};

package/src/layouts/basic-layout/tabs/index.vue

@@ -21,19 +21,19 @@
           <DropdownMenu>
             <DropdownItem name="left">
               <Icon type="md-arrow-back" />
-              {{ $t('basicLayout.tabs.left') }}
+              {{ $t('Front_Label_Tabs_Left') }}
             </DropdownItem>
             <DropdownItem name="right">
               <Icon type="md-arrow-forward" />
-              {{ $t('basicLayout.tabs.right') }}
+              {{ $t('Front_Label_Tabs_Right') }}
             </DropdownItem>
             <DropdownItem name="other">
               <Icon type="md-close" />
-              {{ $t('basicLayout.tabs.other') }}
+              {{ $t('Front_Label_Tabs_Other') }}
             </DropdownItem>
             <DropdownItem name="all">
               <Icon type="md-close-circle" />
-              {{ $t('basicLayout.tabs.all') }}
+              {{ $t('Front_Label_Tabs_All') }}
             </DropdownItem>
           </DropdownMenu>
         </template>

package/src/layouts/basic-layout/water-mark/index.vue

@@ -1,29 +1,29 @@
-<template>
-  <div :style="styles" v-if="waterMark.show"></div>
-</template>
-<script>
-  import { mapState } from 'vuex';
-  import getWaterMarkCanvas from '../../../libs/water-mark';
-
-  export default {
-    name: 'i-water-mark',
-    computed: {
-      ...mapState('admin/layout', ['waterMark']),
-      styles() {
-        const url = getWaterMarkCanvas(this.waterMark.text, this.waterMark.options);
-        return {
-          width: '100%',
-          height: '100%',
-          position: 'absolute',
-          top: '0',
-          left: '0',
-          'z-index': '2000',
-          'background-size': '320px',
-          'background-repeat': 'repeat',
-          'background-image': `url(${url})`,
-          'pointer-events': 'none'
-        };
-      }
-    }
-  };
-</script>
+<template>
+  <div :style="styles" v-if="waterMark.show"></div>
+</template>
+<script>
+  import { mapState } from 'vuex';
+  import getWaterMarkCanvas from '../../../libs/water-mark';
+
+  export default {
+    name: 'i-water-mark',
+    computed: {
+      ...mapState('admin/layout', ['waterMark']),
+      styles() {
+        const url = getWaterMarkCanvas(this.waterMark.text, this.waterMark.options);
+        return {
+          width: '100%',
+          height: '100%',
+          position: 'absolute',
+          top: '0',
+          left: '0',
+          'z-index': '2000',
+          'background-size': '320px',
+          'background-repeat': 'repeat',
+          'background-image': `url(${url})`,
+          'pointer-events': 'none'
+        };
+      }
+    }
+  };
+</script>

package/src/libs/random_str.js

@@ -1,10 +1,10 @@
-// 生成随机字符串
-export default function (len = 32) {
-  const $chars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890';
-  const maxPos = $chars.length;
-  let str = '';
-  for (let i = 0; i < len; i++) {
-    str += $chars.charAt(Math.floor(Math.random() * maxPos));
-  }
-  return str;
-}
+// 生成随机字符串
+export default function (len = 32) {
+  const $chars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890';
+  const maxPos = $chars.length;
+  let str = '';
+  for (let i = 0; i < len; i++) {
+    str += $chars.charAt(Math.floor(Math.random() * maxPos));
+  }
+  return str;
+}

package/src/libs/request/index.js

@@ -30,11 +30,10 @@ function errorLog(err) {
     console.log(err);
   }
   swal.fire({
-    title: err.message,
+    title: tParam(err.message),
     icon: 'error',
-    confirmButtonText: '确定',
-    confirmButtonColor: '#2d8cf0',
-    cancelButtonText: '取消'
+    confirmButtonText: window.$t('Front_Btn_OK'),
+    cancelButtonText: window.$t('Front_Btn_Cancel')
   });
 }
 
@@ -44,6 +43,21 @@ const service = axios.create({
   // timeout: 5000 // 请求超时时间
 });
 
+// 解析多语言带参数
+const tParam = str => {
+  let array = str.split('|');
+  let result = window.$t(array[0]);
+
+  if (array.length > 1) {
+    for (let i = 0; i < array.length - 1; i++) {
+      result = result.replace('{' + i + '}', array[i + 1]);
+      result = result.replace('[' + i + ']', window.$t('Model_' + array[i + 1]));
+    }
+  }
+
+  return result;
+};
+
 // 请求拦截器
 service.interceptors.request.use(
   config => {

package/src/libs/water-mark.js

@@ -1,44 +1,44 @@
-/**
- * @description 生成水印
- * */
-export default function getWaterMarkCanvas(text, options) {
-  const canvas = document.createElement('canvas');
-  const ctx = canvas.getContext('2d');
-  const canvasWidth = 400;
-  const canvasHeight = 400;
-  canvas.width = canvasWidth;
-  canvas.height = canvasHeight;
-  ctx.textAlign = 'center';
-  ctx.textBaseline = 'bottom';
-  ctx.globalAlpha = options.globalAlpha || 0.1;
-  ctx.font = options.font || '20px Microsoft Yahei';
-
-  ctx.translate(canvasWidth / 2, canvasHeight / 2);
-  ctx.rotate(options.rotateAngle || -0.4);
-
-  ctx.translate((-canvasWidth / 2) * 1.2, (-canvasHeight / 2) * 1.2);
-
-  const waterMarkText = [];
-  const chunkWidth = options.chunkWidth || 400;
-  const chunkHeight = options.chunkHeight || 120;
-  const horizontalChunkCount = 0;
-  const verticalChunkCount = 1;
-
-  for (let j = 0, initY = chunkHeight / 2, indent = 0; j <= verticalChunkCount; j += 1) {
-    indent = parseInt(j % 2);
-
-    for (let i = 0, initX = chunkWidth / 2; i <= horizontalChunkCount; i += 1) {
-      waterMarkText.push({
-        text,
-        x: i * chunkWidth + indent * initX,
-        y: j * chunkHeight + initY
-      });
-    }
-  }
-
-  waterMarkText.forEach(item => {
-    ctx.fillText(item.text, item.x, item.y);
-  });
-
-  return ctx.canvas.toDataURL();
-}
+/**
+ * @description 生成水印
+ * */
+export default function getWaterMarkCanvas(text, options) {
+  const canvas = document.createElement('canvas');
+  const ctx = canvas.getContext('2d');
+  const canvasWidth = 400;
+  const canvasHeight = 400;
+  canvas.width = canvasWidth;
+  canvas.height = canvasHeight;
+  ctx.textAlign = 'center';
+  ctx.textBaseline = 'bottom';
+  ctx.globalAlpha = options.globalAlpha || 0.1;
+  ctx.font = options.font || '20px Microsoft Yahei';
+
+  ctx.translate(canvasWidth / 2, canvasHeight / 2);
+  ctx.rotate(options.rotateAngle || -0.4);
+
+  ctx.translate((-canvasWidth / 2) * 1.2, (-canvasHeight / 2) * 1.2);
+
+  const waterMarkText = [];
+  const chunkWidth = options.chunkWidth || 400;
+  const chunkHeight = options.chunkHeight || 120;
+  const horizontalChunkCount = 0;
+  const verticalChunkCount = 1;
+
+  for (let j = 0, initY = chunkHeight / 2, indent = 0; j <= verticalChunkCount; j += 1) {
+    indent = parseInt(j % 2);
+
+    for (let i = 0, initX = chunkWidth / 2; i <= horizontalChunkCount; i += 1) {
+      waterMarkText.push({
+        text,
+        x: i * chunkWidth + indent * initX,
+        y: j * chunkHeight + initY
+      });
+    }
+  }
+
+  waterMarkText.forEach(item => {
+    ctx.fillText(item.text, item.x, item.y);
+  });
+
+  return ctx.canvas.toDataURL();
+}