系统配置查询条件与编辑内容联动显示问题

wangfei

2025-04-23 eeaddf88176b61b01db069c0939bdaaa3da23e69

 UI-Project/src/layout/MainErpView.vue

@@ -3,21 +3,23 @@
import userInfo from '@/stores/userInfo'
import request from '@/utils/request'
import {ElMessage} from 'element-plus'
import {ref, watch, onMounted } from 'vue'
import {ref, watch, onMounted, onUnmounted } from 'vue'
import deepClone from '@/utils/deepClone'
import { useRouter } from 'vue-router';  
import { useI18n } from 'vue-i18n'
  const { t } = useI18n()
  let language = ref(localStorage.getItem('lang') || 'zh')
import { provide } from 'vue';
// import {host, WebSocketHost} from '@/utils/constants'
// import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService';
const globalDate = ref('');
const { t } = useI18n()
let language = ref(localStorage.getItem('lang') || 'zh')
const store = userInfo()
const isCollapse = ref(false);  
// const { $i18n } = useI18n(); // 获取 i18n 实例  
const router = useRouter()
const userStore = useUserInfoStore()
// const user = userStore.user.userName

let userInfoStr = window.localStorage.getItem('userInfo')
console.log(userInfoStr);
// const userInfoStr = localStorage.getItem('userInfo');  
// let userInfo = userInfoStr.user.token;  
let token = userInfo; // 提取 token  
@@ -29,6 +31,15 @@
              })
  router.push('/login')  
}
// let socket = null;
// const socketUrl = `ws://${WebSocketHost}:${host}/api/loadGlass/api/talk/mainMes`;
// const handleMessage = (data) => {
//   if(data.globalDate!=null){
//     window.localStorage.setItem('getglobalDate', data.globalDate[0])
//   }else{
//     globalDate.value = ''
//       }
//     }
  function replaceChineseWithEnglish(menuData) {  
      // 定义中俄文对照关系对象
       const translation  = {  
@@ -66,18 +77,25 @@
} 
function replaceChineseWithRussian(menuData) {  
      // 定义中英文对照关系对象
       const translation  = {  
   const translation  = {  
    '上片机': 'Loading Machine',
    '上片': 'Start showing a movie',
    '上片一线': 'First line on film',
    '上片二线': 'Second line on film',
    '掰片/识别': 'Breaking /Identification',
    '掰片一线': 'Broken piece line',
    '掰片二线': 'Broken pieces with two lines',
    '卧式缓存': 'Horizontal cache',
    '卧式缓存一号线': 'Horizontal Cache 1',
    '卧式缓存二号线': 'Horizontal Cache 2',
    '磨边前卧式缓存': 'Horizontal buffer before edge grinding',
    '下片卧式缓存': 'Offline horizontal cache',
    '磨边（冷加工）': 'Grinding edge (cold processing)',
    '磨边(冷加工)': 'Grinding edge (cold processing)',
    '1线磨边(冷加工)': '1-line edge grinding (cold processing)',
    '2线磨边(冷加工)': '2-line edge grinding (cold processing)',
    '大理片笼': 'Dali slice cage',
    '钢化': 'Toughened',
    '钢化查询': 'Tempered steel inquiry',
    '钢化前': 'Before Tempering',
    '钢化后': 'After Tempering',
    '下片台': 'Next Stage',
@@ -85,10 +103,20 @@
    '用户管理': 'User Management',
    '权限管理': 'Rights Management',
    '角色管理': 'Roles',
    '系统配置': 'system configuration',
    '可视化系统': 'visualization system',
    '报工管理': 'Job reporting management',
    '仓储中心': 'Storage Center',
    '原片仓储': 'Original film storage',
    '中空': 'Hollow',
    '中空一线': 'Hollow Line',
    '中空二线': 'Hollow Second Line',
    '中空三线': 'Hollow three line',
    '中空理片笼': 'Hollow Film processing cage',
    '折铝框一线': '1 Fold aluminum frame',
    '折铝框二线': '2 Fold aluminum frame',
    '折铝框三线': '3 Fold aluminum frame',
    '大屏显示': 'Large Screen Display',
     };  
  menuData.forEach(menu => {  
    menu.menuName = translation[menu.menuName] || menu.menuName;  
@@ -101,11 +129,9 @@
} 
//提取菜单模块列表
let menuList = $ref([])

request.get('/loadGlass/sys/menu/getMenuTree').then((res) => {
  if (res.code == 200) {
    menuList = res.data
    console.log(language.value)
    // translateMenu(menuList.value, language.value); 
      if (language.value === 'en') {
        replaceChineseWithRussian(menuList);
@@ -118,9 +144,15 @@
    router.push('/login')
  }
})
request.post('/loadGlass/sys/menu/getNowDate').then((res) => {
  if (res.code == 200) {
      window.localStorage.setItem('getglobalDate', res.data)
  } else {
    ElMessage.warning(res.msg)
  }
})
const menu = ref(null)
let indexKey = ref(null)

function handleOpen(key) {
  indexKey.value = key
}
@@ -133,11 +165,9 @@
    },
    {deep: true}
)

router.beforeEach((to, from) => {
  //return false
})

let openFlag = $ref(null)
//原始菜单打开
const openMenu = (menuID) => {
@@ -150,8 +180,36 @@
function toggleCollapse() {  
  isCollapse.value = !isCollapse.value;  
} 
onMounted(() => {
  // fetchlack()
  // socket = initializeWebSocket(socketUrl, handleMessage);
});
// const fetchlack = async () => {
//   try  {
//     console.log(33333);
//     const response = await request.post('/loadGlass/sys/menu/getNowDate')
//     console.log(response.code);
//     if (response.code == 200) {
//       console.log(11111);
//       console.log(response.data);
//       console.log(2222);
//       // window.localStorage.setItem('getglobalDate', response.data)
//     } else {
//       ElMessage.error(response.message);
//     }
// }
// catch (error) {
//     // 处理错误
//   }
// }
  let getglobalDate = window.localStorage.getItem('getglobalDate')
  provide('globalDate', getglobalDate);
  // onUnmounted(() => {
    // if (socket) {
    // closeWebSocket(socket);
    // }
    // });
</script>
 
<template>
  <div id="all">
    <el-container>
@@ -160,7 +218,7 @@
          <img src="../assets/northGlass.ico"
               alt=""  @click="toggleCollapse"
               style="max-width: 100%;max-height: 100%">
          <h3 style="margin: 1rem  ;font-weight: bold;width: 33vw;"> {{ $t('main.titleFirst') }}{{ userName }}{{ $t('main.titleLast') }}</h3>
          <h3 style="margin: 1rem;font-weight: bold;width: 33vw;"> {{ $t('main.titleFirst') }}{{ userName }}{{ $t('main.titleLast') }}</h3>
          <span style="height: 70%;width: 78vw;margin-top: 1rem;">
            <!-- <el-button class="sys-quit"
                       @click="quit"
@@ -219,40 +277,29 @@
    </el-container>
  </div>
</template>
 
<style scoped>

.el-menu-vertical-demo:not(.el-menu--collapse) {
  width: 200px;
  min-height: 400px;
  text-align: left;

}




#all {
  background-color: #eee;
  height: 100%;
}

.el-container {
  height: 100vh;
  width: 99vw;
}

* {
  padding: 0;
  margin: 0;
}

:deep(.sys-quit) {
  float: right;
  margin-right: 1rem;
  width: 5rem;
}

/* 横线 */
#line {
  float: right;
@@ -264,16 +311,13 @@
  position: relative;
  text-align: center;
}

:deep(span) {
  margin-right: 0;
}

.el-collapse {
  font-size: 16px;
  font-weight: bold;
}

#main {
  width: 99%;
  float: right;
@@ -281,9 +325,7 @@
  background-color: #fff;
}
/*------------*/

/* .menu div div{
 
  width: 138px;
  height: 35px;
  line-height: 35px;
@@ -305,24 +347,20 @@
/* background-color:#5CADFE; */
/* box-shadow: 0 8px 16px 0 rgba(0,0,0,0), 0 6px 5px 0 rgba(0,0,0,0.19); */
/* } */

.menu {
  width: 138px;
  height: 33px;
  line-height: 25px;

  color: #000000;
  font-size: 16px;
  padding-left: 15px;
  padding-right: 2px;
}

ul {
  height: auto;
  margin: 1px auto;
  text-align: center;
}

ul li {
  height: 28px;
  width: 180px;
@@ -335,16 +373,13 @@
  text-align: left;
  /* border-radius:8px; */
  /*   outline: none; */

  /* background: #5CADFE; */
  /* box-shadow: 0 8px 16px 0 rgba(0,0,0,0), 0 6px 5px 0 rgba(0,0,0,0.19); */
}

ul li:hover {
  /* background:#5CADFE ; */
  color: #ffffff;
}

ul li a {
  text-decoration: none;
  color: #000000;
@@ -353,7 +388,6 @@
ul li a:hover {
  color: #1087ff;
}

.item_divider {
  width: 118px;
  height: 0px;
@@ -361,7 +395,6 @@
  opacity: 0.8; */
  margin-bottom: 2px;
}

.item a {
  width: 138px;
  height: 35px;
@@ -372,13 +405,11 @@
  font-size: 14px;
  text-decoration: none;
}

.menu_title {
  width: 180px;
  /* white-space: nowrap;  
  overflow: hidden;  
  text-overflow: ellipsis;   */

  height: 45px;
  line-height: 55px;
  /* background: #fafafa; */
@@ -391,12 +422,10 @@
  font-weight: bold;
  overflow: hidden;
}

.menu_title:hover {
  /* background: #dedede; */
  color: #3b9af9;
}

.indicator {
  display: block;
  width: 40px;
@@ -408,7 +437,6 @@
  transition: all 0.3s ease;
  text-align: center;
}

/* 动画效果 */
.enter-x-left {
  z-index: 9;
@@ -418,19 +446,15 @@
  transform: translateX(-50px);
  transition: all 0.3s ease;
}

.enter-x-left:nth-child(1) {
  animation-delay: 0.1s;
}

.enter-x-left:nth-child(2) {
  animation-delay: 0.2s;
}

.enter-x-left:nth-child(3) {
  animation-delay: 0.3s;
}

.enter-x-left:nth-child(4) {
  animation-delay: 0.4s;
}