添加 角色列表中英文json包

wuyouming666

2023-09-01 5313d8736c40de0693f89dce77cb93e9983b5ace

添加   角色列表中英文json包

 CanadaMes-ui/package-lock.json

@@ -5,7 +5,7 @@
  "requires": true,
  "packages": {
    "": {
      "name": "canadames",
      "name": "springboot-vue3",
      "version": "0.1.0",
      "dependencies": {
        "axios": "^0.19.2",
@@ -16,7 +16,8 @@
        "less-loader": "^6.2.0",
        "vue": "^2.6.11",
        "vue-i18n": "^8.26.5",
        "vue-router": "^3.3.4"
        "vue-router": "^3.3.4",
        "vuex": "^3.6.2"
      },
      "devDependencies": {
        "@vue/cli-plugin-babel": "~4.5.0",
@@ -13243,6 +13244,14 @@
      "integrity": "sha1-HuO8mhbsv1EYvjNLsV+cRvgvWCU=",
      "dev": true
    },
    "node_modules/vuex": {
      "version": "3.6.2",
      "resolved": "https://registry.npmmirror.com/vuex/-/vuex-3.6.2.tgz",
      "integrity": "sha512-ETW44IqCgBpVomy520DT5jf8n0zoCac+sxWnn+hMe/CzaSejb/eVw2YToiXYX+Ex/AuHHia28vWTq4goAexFbw==",
      "peerDependencies": {
        "vue": "^2.0.0"
      }
    },
    "node_modules/watchpack": {
      "version": "1.7.5",
      "resolved": "https://registry.npm.taobao.org/watchpack/download/watchpack-1.7.5.tgz",
@@ -25281,6 +25290,12 @@
      "integrity": "sha1-HuO8mhbsv1EYvjNLsV+cRvgvWCU=",
      "dev": true
    },
    "vuex": {
      "version": "3.6.2",
      "resolved": "https://registry.npmmirror.com/vuex/-/vuex-3.6.2.tgz",
      "integrity": "sha512-ETW44IqCgBpVomy520DT5jf8n0zoCac+sxWnn+hMe/CzaSejb/eVw2YToiXYX+Ex/AuHHia28vWTq4goAexFbw==",
      "requires": {}
    },
    "watchpack": {
      "version": "1.7.5",
      "resolved": "https://registry.npm.taobao.org/watchpack/download/watchpack-1.7.5.tgz",

 CanadaMes-ui/package.json

@@ -16,7 +16,8 @@
    "less-loader": "^6.2.0",
    "vue": "^2.6.11",
    "vue-i18n": "^8.26.5",
    "vue-router": "^3.3.4"
    "vue-router": "^3.3.4",
    "vuex": "^3.6.2"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.0",

 CanadaMes-ui/src/lang/locales/en-US.json

@@ -36,5 +36,38 @@
    "northglassMESsystem":"NorthGlassMesSystem",

    "exit":"exit",

    "changePassword":"changePassword",

    "resetPassword": "resetPassword"

    "resetPassword": "resetPassword",

    "home":"Home",

    "role":"role",

    "langRoleManagement": "Role Management",

    "langRoleList": "Role List",

    "langEnterRoleName": "Please enter role name",

    "langAddRole": "Add Role",

    "langName": "Name",

    "langIsValid": "Is Valid",

    "langOperation": "Operation",

    "langPleaseSelect": "Please select",

    "langValid": "Valid",

    "langInvalid": "Invalid",

    "langAddRoleSuccess": "Add role successfully",

    "langEnterName": "Please enter name",

    "langLengthBetween": "Length should be between",

    "langAnd": "and",

    "langCharacters": "characters",

    "langEnterState": "Please enter state",

    "langUpdateState": "Update state successfully",

    "langEditRole": "Edit Role",

    "langEditRoleSuccess": "Edit role successfully",

    "langDeleteRoleConfirm": "Are you sure you want to delete this role?",

    "langPrompt": "Prompt",

    "langDeleteRoleSuccess": "Delete role successfully",

    "langCancelDelete": "Cancelled deleting",

    "langRoleName":"langRoleName",

    "updateSuccessMessage":"updateSuccessMessage",

    "paginationTotal": "Total {total}",

    "paginationSizes": "Items per page",

    "paginationPrev": "Previous",

    "paginationPager": "{currentPage}/{pageCount}",

    "paginationNext": "Next",

    "paginationJumper": "Jump to"

  }

 CanadaMes-ui/src/lang/locales/zh-CN.json

@@ -31,11 +31,47 @@
  "langPassword": "密码",

  "langState": "状态",

  "langSelect": "请选择",

  "langCancel": "取消",

  "langConfirm": "确定",





  "langEditUserTitle": "修改用户",

  "northglassMESsystem":"北玻MES系统",

  "exit":"退出",

  "changePassword":"修改密码"

  "changePassword":"修改密码",

  "resetPassword": "重置密码",

  "home":"主页",

  "role":"角色",

    "langRoleManagement": "角色管理",

    "langRoleList": "角色列表",

    "langEnterRoleName": "请输入角色名称",

    "langAddRole": "添加角色",

    "langName": "名称",

    "langIsValid": "是否有效",

    "langOperation": "操作",

    "langPleaseSelect": "请选择",

    "langValid": "有效",

    "langInvalid": "无效",

    "langConfirm": "确定",

    "langCancel": "取消",

    "langAddRoleSuccess": "添加角色成功",

    "langEnterName": "请输入名称",

    "langLengthBetween": "长度在",

    "langAnd": "和",

    "langCharacters": "个字符之间",

    "langEnterState": "请输入状态",

    "langUpdateState": "状态更新成功",

    "langEditRole": "编辑角色",

    "langEditRoleSuccess": "编辑角色成功",

    "langDeleteRoleConfirm": "确定要删除该角色吗？",

    "langPrompt": "提示",

    "langDeleteRoleSuccess": "删除角色成功",

    "langCancelDelete": "已取消删除",

    "langRoleName":"角色名称",

    "updateSuccessMessage":"更新成功",

    "paginationTotal": "共 {total} 条",

    "paginationSizes": "每页显示",

    "paginationPrev": "上一页",

    "paginationPager": "{currentPage}/{pageCount}",

    "paginationNext": "下一页",

    "paginationJumper": "跳至"

  }

  

 CanadaMes-ui/src/layout/index.vue

@@ -5,16 +5,25 @@
      <el-aside :width="isCollapse?'70px':'250px'">
        <el-col :gutter="20">
          <el-row :span="4">
            <div class="logo">
              <div class="sys-name" v-show="!isCollapse">{{ $t('northglassMESsystem') }}</div>
            </div>
            <div class="logo" @click="goToHome">
  <div class="sys-name" v-show="!isCollapse">{{ $t('northglassMESsystem') }}</div>
</div>
          </el-row>
          <el-row :span="20">
            <el-menu :default-active="activePath" class="el-menu-vertical-demo"
                     background-color="#222f3e" text-color="#fff" active-text-color="#ffd04b"
                     :collapse="isCollapse" :unique-opened="true"
                     :collapse-transition="false" :router="true">
              <!--一级菜单-->
                     <el-menu-item index="/" @click="goToHome">
  <template slot="title">
    <!--图标-->
    <i class="el-icon-menu"></i>
    <!--文本-->
    <span>{{ $t('home') }}</span>
  </template>
</el-menu-item>
              
                     <!--一级菜单-->
              <el-submenu :index="item.id.toString()" v-for="item in menuList" :key="item.id">
                <!--一级菜单模板区域-->
                <template slot="title">
@@ -26,7 +35,7 @@
                <!--二级菜单-->
                <el-menu-item :index="'/'+menu.router"
                              v-for="menu in item.menuLists" :key="menu.id"
                              @click="saveNavState('/'+menu.router)">
                              @click="saveNavState('/'+menu.router)"   @select="saveNavState" :default-active="$route.path">
                  <template slot="title">
                    <!--图标-->
                    <i :class="menu.icon"></i>
@@ -34,19 +43,27 @@
                    <span>{{ menu.name }}</span>
                  </template>
                </el-menu-item>
                
              </el-submenu>
   
            </el-menu>
          </el-row>
        </el-col>
      </el-aside>
    </div>
    <el-container>
     
      <div>
   
  </div>
      <el-header class="header-container">
        <!-- <div class="tagContainer">
               <tag></tag>

        </div> -->
        </div>  -->
        
        <div class="tagContainer">
      <tag v-for="(tag, index) in tags" :key="index" :tag="tag" @removeTag="removeTag"></tag>
    </div>
        <el-menu :default-active="activePath1" class="el-menu-demo" mode="horizontal"
                 background-color="#576574" text-color="#fff" active-text-color="#ffd04b">
                 <div class="header-left">
@@ -55,7 +72,7 @@
          <el-submenu index="1" class="user-icon">
        
            <template slot="title">
              <el-avatar src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png">
              <el-avatar src="../assets/emi.png">
              </el-avatar>
            </template>
            <el-menu-item index="1-1" @click="logout">{{ $t('exit') }}</el-menu-item>
@@ -96,13 +113,18 @@
import {changePassword} from '../api/user'
import {removeToken} from "../utils/auth";
import LanguageMixin from '../lang/LanguageMixin'
// import Tag from '../layout/tag.vue';
import { mapState, mapMutations } from 'vuex';
 import Tag from '../layout/tag.vue';
 import store from '../store'; 

export default {
  name: "Layout",
  store,
  mixins: [LanguageMixin],
  data() {
    return {
   
      activeTag: '', // 当前激活的标签
      dialogVisible: false,
      formData: {
        oldPassword: '',
@@ -120,9 +142,9 @@
      }
    }
  },
  // components: {
  //   Tag
  // },
   components: {
   Tag
   },
  created() {
    selectList(this.menuListForm).then(res => {
      this.menuList = res.data
@@ -135,12 +157,36 @@
      this.activePath = window.sessionStorage.getItem('activePath')
    });
  },
  computed: {
    ...mapState('tags', ['tags'])
  },
  methods: {
    logout: function () {
      removeToken()
      this.$router.push('/login')
    },
    goToHome() {
    this.$router.push('/home');
  },
   // 使用 mapMutations 辅助函数调用 Store 中的 mutations
   ...mapMutations('tags', ['addTag', 'removeTag']),
    // 切换标签时触发的方法
    saveNavState(activePath) {
      window.sessionStorage.setItem('activePath', activePath);

      const menuItem = this.menuList.find(item => item.menuLists.some(menu => menu.router === activePath));
      if (menuItem) {
        const submenuItem = menuItem.menuLists.find(menu => menu.router === activePath);
        if (submenuItem) {
          const tag = submenuItem.name;
          this.$store.commit('tags/addTag', tag);  // 调用 Vuex Store 中的 addTag mutation
        }
      }
    },
    // 关闭标签时触发的方法
    removeTag(tag) {
      this.removeTag(tag); // 从 Vuex Store 中移除标签
    },
 

    showChangePasswordDialog() {
@@ -173,9 +219,9 @@
    toggleCollapse: function () {
      this.isCollapse = !this.isCollapse;
    },
    saveNavState: function (activePath) {
      window.sessionStorage.setItem('activePath', activePath)
    },
    // saveNavState: function (activePath) {
    //   window.sessionStorage.setItem('activePath', activePath)
    // },
    replaceChineseWithEnglish(menuData) {
      // 定义中英文对照关系对象
      const translation = {

 CanadaMes-ui/src/layout/tag.vue

@@ -1,91 +1,59 @@
<template>

    <div class="_tag">

      <el-scrollbar style="margin-right: 6px;">

        <div class="left">

          <el-tag

            v-for="tag in tagsList"

            :key="tag.title"

            :closable="!tag.hideclose"

            :type="isActive(tag)"

            @close="removeTag(tag)"

            @click="handleTagClick(tag)"

          >

            <router-link :to="tag.path" class="tag-title">{{ tag.title }}</router-link>

          </el-tag>

        </div>

      </el-scrollbar>

  
      <el-dropdown @command="handleCloseBtn" class="_dropdown">

        <el-button type="primary" size="small">

          标签选项

          <i class="el-icon-arrow-down el-icon--right"></i>

        </el-button>

        <el-dropdown-menu slot="dropdown">

          <el-dropdown-item command="closeOther">关闭其它</el-dropdown-item>

          <el-dropdown-item command="closeAll">关闭所有</el-dropdown-item>

        </el-dropdown-menu>

      </el-dropdown>

  <div class="tagContainer">

    <div v-for="(tag, index) in tags" :key="index" class="tagItem">

      {{ tag }}

      <span class="closeBtn" @click="removeTag(index)">x</span>

    </div>

  </template>

  
  <script>

  import { mapState, mapMutations } from "vuex";

  
  export default {

    computed: {

      ...mapState("tags", ["tagsList"]),

      activeTag() {

        return this.tagsList.find(tag => tag.path === this.$route.fullPath);

      }

    },

    methods: {

      ...mapMutations("tags", ["removeTag"]),

      handleCloseBtn(command) {

        if (command === "closeOther") {

          const activeTag = this.activeTag;

          if (!activeTag || activeTag.hideclose) return;

          this.$store.commit("tags/removeOtherTags", activeTag);

        } else if (command === "closeAll") {

          this.$store.commit("tags/removeAllTags");

          this.$router.push({ name: "sadmasMain" });

        }

      },

      isActive(tag) {

        return tag.path === this.$route.fullPath ? "" : "info";

      },

      handleTagClick(tag) {

        this.$router.push(tag.path);

      }

    },

    watch: {

      $route(newValue) {

        const isExist = this.tagsList.some(item => item.path === newValue.fullPath);

        if (!isExist) {

          this.$store.commit("tags/addTag", {

            title: newValue.meta.title || "",

            path: newValue.fullPath,

            hideclose: newValue.meta.hideclose || false

          });

        }

  </div>

</template>



<script>

import { mapState, mapMutations } from 'vuex';



export default {

  computed: {

    ...mapState('tags', { // 这里添加了 'tags' 模块的命名空间前缀

      tags: state => state.tags.tags

    })

  },

  methods: {

    ...mapMutations('tag', ['removeTag']),

    saveNavState(activePath) {

    window.sessionStorage.setItem('activePath', activePath);

    
    const menuItem = this.menuList.find(item => item.menuLists.some(menu => menu.router === activePath));

    if (menuItem) {

      const submenuItem = menuItem.menuLists.find(menu => menu.router === activePath);

      if (submenuItem) {

        const tag = submenuItem.name;

        this.addTag(tag); // 添加标签到 Vuex Store

      }

    }

  };

  </script>

  
  <style scoped>

  ._tag {

    display: flex;

    align-items: center;

    padding: 10px;

  }

  
  .left {

    display: flex;

    flex-wrap: wrap;

  }

  
  .tag-title {

    cursor: pointer;

  }

  </style>

  
}

</script>



<style scoped>

.tagContainer {

  display: flex;

  flex-wrap: wrap;

  margin-bottom: 10px;

}



.tagItem {

  background-color: #eee;

  border-radius: 4px;

  padding: 4px 8px;

  margin-right: 8px;

  margin-bottom: 8px;

  display: flex;

  align-items: center;

}



.closeBtn {

  margin-left: 4px;

  color: red;

  cursor: pointer;

}

</style>


 CanadaMes-ui/src/main.js

@@ -8,12 +8,13 @@
import VueI18n from 'vue-i18n'
import zhCN from './lang/locales/zh-CN.json' // 中文语言包
import enUS from './lang/locales/en-US.json' // 英文语言包
import store from './store'

// import store from './store'
Vue.use(VueI18n)

const i18n = new VueI18n({
  locale: 'zh-CN', // 设置默认语言为中文
  locale: 'en-US', 
  messages: {
    'zh-CN': zhCN, // 注册中文语言包
    'en-US': enUS // 注册英文语言包
@@ -34,6 +35,7 @@
new Vue({
    router,
    i18n,
    store,

    render: h => h(App)
}).$mount('#app');

 CanadaMes-ui/src/store/store,js

File was deleted

 CanadaMes-ui/src/views/device/alarm.vue

@@ -1,41 +1,42 @@
<template>

  <div class="app">

  <div>

    <p>{{ receivedMessage }}</p>

    <button @click="sendMessage">Send Message</button>

  </div>

</template>



<script>

export default {

  name:'alarm',

  data() {

    return {

      websocket: null,

      receivedMessage: ''

    };

  },

  mounted() {

    this.websocket = new WebSocket('ws://localhost:8080');



    <el-breadcrumb separator-class="el-icon-arrow-right" class="el-breadcrumb">

      <router-link to="/home" tag="el-button" type="text">{{ $t('langHome') }}</router-link>

      <el-button type="text">设备管理</el-button>

      <router-link to="/device/iostate" tag="el-button" type="text">IO状态</router-link>

      <router-link to="/device/alarm" tag="el-button" type="text">报警信息</router-link>

      <router-link to="/device/parameter" tag="el-button" type="text">参数下发</router-link>

      <router-link to="/device/control" tag="el-button" type="text">开关控制</router-link>

    </el-breadcrumb>

    <div>报警信息</div>

    </div>

  </template>

  
  <script>

    this.websocket.onopen = () => {

      console.log('WebSocket connection opened');

    };



  
  export default {

    name: "alarm",

   
    this.websocket.onmessage = (event) => {

      this.receivedMessage = event.data;

    };



    this.websocket.onclose = () => {

      console.log('WebSocket connection closed');

    };

  },

  methods: {

    sendMessage() {

      if (this.websocket.readyState === WebSocket.OPEN) {

        this.websocket.send('Hello WebSocket!');

      } else {

        console.log('WebSocket connection is not open');

      }

    }

    
  </script>

  
  <style lang="less" scoped>

  .el-table {

    margin-top: 15px;

    font-size: 12px;

  }

  
  .el-pagination {

    margin-top: 15px;

  }

  
  .app .el-card {

    width: 99%;

  }

  </style>

  
};

</script>


 CanadaMes-ui/src/views/login/index.vue

@@ -1,6 +1,6 @@
<template>
  <div class="login_container">
    <div class="system_title">{{ $t('systemTitle') }}</div>
    <div class="system_title"  >{{ $t('northglassMESsystem') }}</div>
    <div class="login_box">
      <!--头像区域-->
      <!-- <div class="avatar_box">
@@ -139,7 +139,8 @@
  font-weight: bold;
  text-align: center;
  margin-bottom: 20px;
 top:50px;
  position: relative; top: 100px;

}
.btns {
  display: flex;

 CanadaMes-ui/src/views/power/index.vue

@@ -56,7 +56,7 @@
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="queryInfo.pageNum"
          :page-sizes="[10, 20, 30, 40]"
          :page-sizes="[6, 12, 18, 24]"
          :page-size="queryInfo.pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="powerList.total">
@@ -157,7 +157,7 @@
    return {
      queryInfo: {
        pageNum: 1,
        pageSize: 10
        pageSize: 6
      },
      powerList: {
        records: [],

 CanadaMes-ui/src/views/role/index.vue

@@ -2,30 +2,30 @@
  <div class="app">
    <!--面包屑导航区域-->
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>角色管理</el-breadcrumb-item>
      <el-breadcrumb-item>角色列表</el-breadcrumb-item>
      <el-breadcrumb-item :to="{ path: '/home' }">{{$t('langHome')}}</el-breadcrumb-item>
      <el-breadcrumb-item>{{$t('langRoleManagement')}}</el-breadcrumb-item>
      <el-breadcrumb-item>{{$t('langRoleList')}}</el-breadcrumb-item>
    </el-breadcrumb>
    <!--卡片视图区域-->
    <el-card class="el-card">
      <el-row :gutter="20">
        <!--搜索与添加区域-->
        <el-col :span="6">
          <el-input placeholder="请输入角色名称" v-model="queryInfo.name" clearable @clear="getRoleList()">
            <el-button slot="append" icon="el-icon-search" @click="getRoleList()"></el-button>
          </el-input>
        </el-col>
  <el-input :placeholder="$t('langEnterRoleName')" v-model="queryInfo.name" clearable @clear="getRoleList()">
    <el-button slot="append" icon="el-icon-search" @click="getRoleList()"></el-button>
  </el-input>
</el-col>
        <!--添加区域-->
        <el-col :span="4">
          <el-button type="primary" @click="showAddDialog">添加角色</el-button>
          <el-button type="primary" @click="showAddDialog">{{$t('langAddRole')}}</el-button>
        </el-col>
      </el-row>
      <!--角色列表区域-->
      <el-table :data="roleList.records" border stripe>
        <el-table-column label="#" type="index"></el-table-column>
        <el-table-column label="名称" prop="name"></el-table-column>
        <el-table-column label="创建时间" prop="createTime"></el-table-column>
        <el-table-column label="是否有效">
  <el-table-column :label="$t('langRoleName')" prop="name"></el-table-column>
  <el-table-column :label="$t('langCreateTime')" prop="createTime"></el-table-column>
  <el-table-column :label="$t('langIsValid')">
          <template slot-scope="scope">
            <el-switch :active-value=1
                       :inactive-value=0
@@ -34,19 +34,17 @@
            </el-switch>
          </template>
        </el-table-column>
        <el-table-column label="操作">
        <el-table-column :label="$t('langOperation')">
          <template slot-scope="scope">
            <!--修改-->
            <el-tooltip effect="dark" content="修改" placement="top" :enterable="false">
              <el-button type="primary" icon="el-icon-edit" size="mini"
                         @click="showEditDialog(scope.row)"></el-button>
            </el-tooltip>
            <!--删除-->
            <el-tooltip effect="dark" content="删除" placement="top" :enterable="false">
              <el-button type="danger" icon="el-icon-delete" size="mini"
                         @click="removeById(scope.row)"></el-button>
            </el-tooltip>
          </template>
  <!-- 修改 -->
  <el-tooltip effect="dark" :content="$t('langEdit')" placement="top" :enterable="false">
    <el-button type="primary" icon="el-icon-edit" size="mini" @click="showEditDialog(scope.row)"></el-button>
  </el-tooltip>
  <!-- 删除 -->
  <el-tooltip effect="dark" :content="$t('langDelete')" placement="top" :enterable="false">
    <el-button type="danger" icon="el-icon-delete" size="mini" @click="removeById(scope.row)"></el-button>
  </el-tooltip>
</template>
        </el-table-column>
      </el-table>
      <!--分页区域-->
@@ -62,17 +60,17 @@
    </el-card>
    <!--添加角色的对话框-->
    <el-dialog
        title="添加角色"
        :title="$t('langAddRole')"
        :visible.sync="addDialogVisible"
        width="50%"
        @close="addDialogClosed">
      <!--内容主体区域-->
      <el-form :model="addRoleForm" :rules="addRoleRules" ref="addRoleRef" label-width="70px">
        <el-form-item label="名称" prop="name">
      <el-form :model="addRoleForm" :rules="addRoleRules" ref="addRoleRef" label-width="130px">
        <el-form-item :label="$t('langRoleName')" prop="name">
          <el-input v-model="addRoleForm.name"></el-input>
        </el-form-item>
        <el-form-item label="状态" prop="state">
          <el-select v-model="addRoleForm.state" placeholder="请选择">
        <el-form-item :label="$t('langState')" prop="state">
          <el-select v-model="addRoleForm.state" placeholder="$t('langPleaseSelect')">
            <el-option v-for="(item,index) in options"
                       :key="index"
                       :value="item.value"
@@ -82,22 +80,22 @@
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
    <el-button @click="addDialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="addRole">确 定</el-button>
    <el-button @click="addDialogVisible = false">{{$t('langCancel')}}</el-button>
    <el-button type="primary" @click="addRole">{{$t('langConfirm')}}</el-button>
  </span>
    </el-dialog>
    <!--修改角色的对话框-->
    <el-dialog
        title="修改角色"
        :title="$t('langEditRole')"
        :visible.sync="editDialogVisible"
        width="50%">
      <!--内容主体区域-->
      <el-form :model="editRoleForm" :rules="addRoleRules" ref="addRoleRef" label-width="70px">
        <el-form-item label="名称" prop="name">
      <el-form :model="editRoleForm" :rules="addRoleRules" ref="addRoleRef" label-width="130px">
        <el-form-item :label="$t('langRoleName')" prop="name">
          <el-input v-model="editRoleForm.name"></el-input>
        </el-form-item>
        <el-form-item label="状态" prop="state">
          <el-select v-model="editRoleForm.state" placeholder="请选择">
        <el-form-item :label="$t('langState')" prop="state">
          <el-select v-model="editRoleForm.state" placeholder="$t('langPleaseSelect')">
            <el-option v-for="(item,index) in options"
                       :key="index"
                       :value="item.value"
@@ -107,8 +105,8 @@
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
    <el-button @click="editDialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="editRoleInfo">确 定</el-button>
    <el-button @click="editDialogVisible = false">{{$t('langCancel')}}</el-button>
    <el-button type="primary" @click="editRoleInfo">{{$t('langConfirm')}}</el-button>
  </span>
    </el-dialog>
  </div>
@@ -116,9 +114,11 @@

<script>
import {getById, removeById, saveOrUpdate, selectPage} from "../../api/role";

import LanguageMixin from '../../lang/LanguageMixin'
export default {
  name: "Role",
  mixins: [LanguageMixin],

  data() {
    return {
      queryInfo: {
@@ -259,4 +259,4 @@
.app .el-card {
  width: 99%;
}
</style>
</style>

 CanadaMes-ui/src/views/user/index.vue

@@ -67,15 +67,19 @@
        </el-table-column>
      </el-table>
      <!--分页区域-->
      <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="queryInfo.pageNum"
          :page-sizes="[10, 20, 30, 40]"
          :page-size="queryInfo.pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="userList.total">
      </el-pagination>
       <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="queryInfo.pageNum"
      :page-sizes="[6, 12, 18, 24]"
      :page-size="queryInfo.pageSize"
      :total="userList.total"
      :prev-text="$t('pagination.prev')"
      :next-text="$t('pagination.next')"
      :pager-count="7"
      :layout="layout"
    >
    </el-pagination>
    </el-card>
    <!--添加用户的对话框-->
    <el-dialog
@@ -131,7 +135,7 @@
        <el-form-item :label="$t('langUsername')" prop="username">
          <el-input v-model="editUserForm.username" disabled></el-input>
        </el-form-item>
        <el-form-item label="角色" prop="roleId">
        <el-form-item :label="$t('role')" prop="roleId">
          <el-select filterable v-model="editUserForm.roleId" placeholder="请选择">
            <el-option v-for="item in roleList"
                       :key="item.id"
@@ -170,11 +174,13 @@
export default {
  name: "User",
  mixins: [LanguageMixin],

  data() {
    return {
      layout: 'total, sizes, prev, pager, next, jumper',
      queryInfo: {
        pageNum: 1,
        pageSize: 10
        pageSize: 6
      },
      userList: {
        records: [],
@@ -227,6 +233,7 @@
        this.userList.records = res.data.records;
        this.userList.total = res.data.total
      });
    
//       test().then(res => {
//         console.log(res.data)
//       });
@@ -248,25 +255,39 @@
//       });

    },
   
  
    showAddDialog() {
      this.addDialogVisible = true;
       select().then(res => {
  this.roleList = res.data;
});
    },
    // stateChange(info) {
    //   saveOrUpdate(info).then(() => {
    //     this.$message.success("更新状态成功")
    //   });
    // },
    stateChange(info) {
      saveOrUpdate(info).then(() => {
        this.$message.success("更新状态成功")
      });
    },
  saveOrUpdate(info).then(() => {
    const successMessage = this.$t('updateSuccessMessage');
    this.$message.success(successMessage);
  });
},
    resetPassword(info) {
  this.$confirm('确认重置密码为默认值吗？', '重置密码', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'warning',
  })
    .then(() => {
      resetPass(info).then(() => {
        this.$message.success("密码已重置为默认值");
        this.$message.success('密码已重置为默认值');
      });
  
   
  },
    })
    .catch(() => {
      // 用户取消重置密码操作
    });
},
    showEditDialog(id) {
      getById({id: id}).then(res => {
        this.editUserForm = res.data;