Commit c8f12186ab1428f367f5fd89982e3311e1db95bb
1 parent
9e61d9ac
1.处理快捷菜单的英文版样式
Showing
3 changed files
with
71 additions
and
4 deletions
src/mes/common/buttonComponent/index.js
src/mes/productionExec/quickSwitchTabComponent/index.js
| @@ -101,21 +101,54 @@ const QuickSwitchTabComponent = baseProps => { | @@ -101,21 +101,54 @@ const QuickSwitchTabComponent = baseProps => { | ||
| 101 | // 默认返回原始列表 | 101 | // 默认返回原始列表 |
| 102 | return list; | 102 | return list; |
| 103 | } | 103 | } |
| 104 | + | ||
| 105 | + function translateTipList(language) { | ||
| 106 | + // 原始中文列表 | ||
| 107 | + const list = ["生产执行", "质量巡检", "拼版图", "产品图", "报工任务"]; | ||
| 108 | + | ||
| 109 | + // 定义多语言映射 | ||
| 110 | + const translations = { | ||
| 111 | + sEnglish: { | ||
| 112 | + "生产执行": "Production Execution-生产执行", | ||
| 113 | + "质量巡检": "Quality Inspection-质量巡检", | ||
| 114 | + "拼版图": "Assembly Drawing-拼版图", | ||
| 115 | + "产品图": "Product Drawing-产品图", | ||
| 116 | + "报工任务": "Work Reporting Task-报工任务" | ||
| 117 | + }, | ||
| 118 | + sBig5: { | ||
| 119 | + "生产执行": "生產執行", | ||
| 120 | + "质量巡检": "質量巡檢", | ||
| 121 | + "拼版图": "拼版圖", | ||
| 122 | + "产品图": "產品圖", | ||
| 123 | + "报工任务": "報工任務" | ||
| 124 | + } | ||
| 125 | + }; | ||
| 126 | + | ||
| 127 | + // 根据语言设置进行转换 | ||
| 128 | + if (translations[language]) { | ||
| 129 | + return list.map(item => translations[language][item] || item); | ||
| 130 | + } | ||
| 131 | + // 默认返回原始列表 | ||
| 132 | + return list; | ||
| 133 | + } | ||
| 104 | const sLanguage = props.app.userinfo.sLanguage || 'sChinese'; | 134 | const sLanguage = props.app.userinfo.sLanguage || 'sChinese'; |
| 105 | - list = translateList(sLanguage); | 135 | + list = translateList(sLanguage); |
| 136 | + const tipList = translateTipList(sLanguage); | ||
| 106 | const no = commonFunc.showLocalMessage(props, 'No', '暂无'); | 137 | const no = commonFunc.showLocalMessage(props, 'No', '暂无'); |
| 107 | return ( | 138 | return ( |
| 108 | - <div className={styles.quickSwitchTabComponent} ref={ref}> | 139 | + <div className={sLanguage === 'sEnglish' ? styles.quickSwitchTabEngComponent : styles.quickSwitchTabComponent} ref={ref}> |
| 109 | {list.map((title, index) => { | 140 | {list.map((title, index) => { |
| 110 | const currentId = listId[index]; | 141 | const currentId = listId[index]; |
| 111 | const currentMesPane = commonUtils.convertStrToObj( | 142 | const currentMesPane = commonUtils.convertStrToObj( |
| 112 | localStorage.xlybusinesscurrentMesPane | 143 | localStorage.xlybusinesscurrentMesPane |
| 113 | ); | 144 | ); |
| 114 | const { sModelsId } = currentMesPane; | 145 | const { sModelsId } = currentMesPane; |
| 146 | + const tip = tipList[index]; | ||
| 115 | 147 | ||
| 116 | return ( | 148 | return ( |
| 117 | <div | 149 | <div |
| 118 | className={currentId === sModelsId ? styles.active : ""} | 150 | className={currentId === sModelsId ? styles.active : ""} |
| 151 | + title={tip} | ||
| 119 | onClick={() => { | 152 | onClick={() => { |
| 120 | if (currentId) { | 153 | if (currentId) { |
| 121 | props.onChangeRouter({ | 154 | props.onChangeRouter({ |
src/mes/productionExec/quickSwitchTabComponent/index.less
| @@ -33,4 +33,38 @@ | @@ -33,4 +33,38 @@ | ||
| 33 | background: #D2E5FF; | 33 | background: #D2E5FF; |
| 34 | color: #1890FF; | 34 | color: #1890FF; |
| 35 | } | 35 | } |
| 36 | -} | ||
| 37 | \ No newline at end of file | 36 | \ No newline at end of file |
| 37 | +} | ||
| 38 | + | ||
| 39 | +.quickSwitchTabEngComponent{ | ||
| 40 | + z-index: 20; | ||
| 41 | + position: absolute; | ||
| 42 | + top: 0; | ||
| 43 | + right: -10px; | ||
| 44 | + .size(60px, auto); | ||
| 45 | + .flex(); | ||
| 46 | + flex-direction: column; | ||
| 47 | + gap: 10px; | ||
| 48 | + | ||
| 49 | + >div { | ||
| 50 | + .size(100%, 92px); | ||
| 51 | + .flex(center, center); | ||
| 52 | + overflow: hidden; | ||
| 53 | + padding: 0 5px 0 9px; | ||
| 54 | + font-size: 12px; | ||
| 55 | + font-weight: bold; | ||
| 56 | + line-height: 22px; | ||
| 57 | + background: #FFFFFF; | ||
| 58 | + box-shadow: -4px 4px 4px 0px rgba(0, 0, 0, 0.1); | ||
| 59 | + border-radius: 10px 0px 0px 10px; | ||
| 60 | + cursor: default; | ||
| 61 | + | ||
| 62 | + &:hover { | ||
| 63 | + color: #1890FF; | ||
| 64 | + } | ||
| 65 | + } | ||
| 66 | + | ||
| 67 | + .active { | ||
| 68 | + background: #D2E5FF; | ||
| 69 | + color: #1890FF; | ||
| 70 | + } | ||
| 71 | +} |