Skip to content

Y
yd-csf-front
Commit 4b7adae7 by yuzhenWang
Options

修改流程字，加语言切换插件

parent 28e375f1
Showing with 269 additions and 28 deletions
package.json
...@@ -36,6 +36,7 @@ ...@@ -36,6 +36,7 @@
"splitpanes": "^4.0.4", "splitpanes": "^4.0.4",
"vue": "3.5.16", "vue": "3.5.16",
"vue-cropper": "1.1.1", "vue-cropper": "1.1.1",
"vue-i18n": "^9.14.5",
"vue-router": "4.5.1", "vue-router": "4.5.1",
"vuedraggable": "4.1.0", "vuedraggable": "4.1.0",
"xlsx": "^0.18.5" "xlsx": "^0.18.5"
......
src/components/LangSelect/index.vue 0 → 100644
<template>
<el-dropdown trigger="click" @command="handleLanguageChange" class="lang-select">
<span class="el-dropdown-link">
<!-- <el-icon><Global /></el-icon> -->
{{ currentLangName }}
<el-icon class="el-icon--right"><arrow-down /></el-icon>
</span>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item
v-for="lang in langOptions"
:key="lang.value"
:command="lang.value"
:disabled="currentLanguage === lang.value"
>
{{ lang.label }}
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</template>
<script setup>
import { computed, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { ElMessage } from 'element-plus'
import { ArrowDown } from '@element-plus/icons-vue'
const { locale, t } = useI18n()
// 语言选项配置
const langOptions = [
{ label: '简体中文', value: 'zh-CN' },
// { label: '繁體中文', value: 'zh-TW' },
{ label: 'English', value: 'en-US' }
// { label: '日本語', value: 'ja-JP' },
// { label: '한국어', value: 'ko-KR' }
]
// 使用 ref 来管理当前语言，避免直接使用 i18n 的响应式对象
const currentLanguage = ref(locale.value)
// 计算当前显示的语言名称
const currentLangName = computed(() => {
const currentLang = langOptions.find(lang => lang.value === currentLanguage.value)
return currentLang ? currentLang.label : '简体中文'
})
// 处理语言切换
const handleLanguageChange = async lang => {
try {
// 更新当前语言
currentLanguage.value = lang
locale.value = lang
localStorage.setItem('lang', lang)
// 使用 setTimeout 避免在同一个 tick 中触发更新
setTimeout(() => {
ElMessage.success({
message: t('common.languageChanged'),
duration: 1500
})
}, 100)
} catch (error) {
console.error('Language change error:', error)
ElMessage.error('语言切换失败')
}
}
</script>
<style scoped>
.lang-select {
cursor: pointer;
display: flex;
align-items: center;
padding: 0 12px;
height: 48px;
color: var(--el-text-color-primary);
}
.lang-select:hover {
background-color: var(--el-color-primary-light-9);
}
.el-icon {
font-size: 18px;
margin-right: 5px;
}
</style>
src/formJson/fnaForm.js
...@@ -27,7 +27,7 @@ const fnaForm = [ ...@@ -27,7 +27,7 @@ const fnaForm = [
fatherRequired: true, //父级必填,代表个人资料这个模块有必填项 fatherRequired: true, //父级必填,代表个人资料这个模块有必填项
data: [ data: [
{ {
label: '陪同顾问姓名', label: '转介人',
key: 'accountName', key: 'accountName',
domType: 'SearchSelect', domType: 'SearchSelect',
required: true, required: true,
...@@ -42,7 +42,7 @@ const fnaForm = [ ...@@ -42,7 +42,7 @@ const fnaForm = [
}, },
{ {
label: '理财顾问注册编号', label: '签单员注册编号',
key: 'registrationNumber', key: 'registrationNumber',
domType: 'Input', domType: 'Input',
inputType: 'text', inputType: 'text',
...@@ -57,7 +57,7 @@ const fnaForm = [ ...@@ -57,7 +57,7 @@ const fnaForm = [
lg: 8 //栅格布局份数 lg: 8 //栅格布局份数
}, },
{ {
label: '理财顾问内部编码', label: '签单员内部编码',
key: 'number', key: 'number',
domType: 'Input', domType: 'Input',
inputType: 'text', inputType: 'text',
...@@ -377,7 +377,6 @@ const fnaForm = [ ...@@ -377,7 +377,6 @@ const fnaForm = [
currency: '', currency: '',
dictType: 'bx_currency_type', dictType: 'bx_currency_type',
marketValue: '' marketValue: ''
} }
] ]
}, },
......
src/lang/en-US.js 0 → 100644
export default {
common: {
welcome: 'Welcome',
login: 'Login',
logout: 'Logout',
confirm: 'Confirm',
cancel: 'Cancel',
save: 'Save',
delete: 'Delete',
edit: 'Edit',
add: 'Add',
search: 'Search',
reset: 'Reset'
},
// 菜单
menu: {
dashboard: 'Dashboard',
workbench: 'Workbench',
sign: 'Signing Center',
fna: 'FNA',
appointment: 'Appointment Information',
underwriting: 'underwriting',
financialCenter: 'Finance Center',
financialIncome: 'Income Management',
financialBilling: 'Expenditure Management',
financialSalary: 'Salary Management'
},
user: {
profile: 'Profile',
settings: 'Settings',
changePassword: 'Change Password'
},
dashboard: {
workOrderProcessing: 'Work Order Processing',
loadMore: 'Load More',
latestNews: 'Latest News',
allProjects: 'All Projects',
financialNeedsAnalysisRecords: 'FNA',
noData: 'No Data',
quickOperations: 'Quick Operations',
documents: 'Documents',
totalPremium: 'Total Premium',
validPolicies: 'Valid',
pendingCommissionPolicies: 'Pending Commission',
financialCenter: 'Financial Center',
appointmentInformation: 'Booking Info',
newOrderFollowUp: 'Underwriting',
policyInquiry: 'Policy',
renewalManagement: 'Renewal',
customerManagement: 'Customer',
financialNeedsAnalysis: 'FNA',
userManual: 'User Manual',
businessProcess: 'Business Process',
companyIntroduction: 'Company Introduction',
contactInformation: 'Contact Information',
financialNeedsAnalysisCount: 'Financial Needs Analysis Count',
appointmentOrders: 'Appointment Orders',
newOrders: 'New Orders',
renewalPolicies: 'Renewal Policies',
productDiscounts: 'Product Discounts',
productTraining: 'Product Training',
importantNotice: 'Important Notice',
systemMessage: 'System Message',
renewalReminder: 'Renewal Reminder',
appointmentOrderGenerated: 'Appointment Order Generated',
thisMonth: 'This Month',
lastThreeMonths: 'Last Three Months',
lastYear: 'Last Year'
}
}
src/lang/index.js 0 → 100644
import { createI18n } from 'vue-i18n'
import zhCN from './zh-CN'
// import zhTW from './zh-TW'
import enUS from './en-US'
// import jaJP from './ja-JP'
// import koKR from './ko-KR'
// 创建 i18n 实例
const i18n = createI18n({
legacy: false, // 使用 Composition API 模式
locale: localStorage.getItem('lang') || 'zh-CN', // 默认语言
messages: {
'zh-CN': zhCN,
// 'zh-TW': zhTW,
'en-US': enUS
// 'ja-JP': jaJP,
// 'ko-KR': koKR
}
})
export default i18n
src/lang/zh-CN.js 0 → 100644
export default {
common: {
welcome: '欢迎!',
login: '登录',
logout: '退出登录',
confirm: '确定',
cancel: '取消',
save: '保存',
delete: '删除',
edit: '编辑',
add: '添加',
search: '搜索',
reset: '重置',
languageChanged: '语言已切换为中文'
},
menu: {
dashboard: '首页',
workbench: '工作台',
sign: '签单中心',
fna: '财务需求分析',
appointment: '预约信息',
underwritingMain: '新单跟进',
financialCenter: '财务中心',
financialIncome: '入账管理',
financialBilling: '出账管理',
financialSalary: '薪资管理'
},
user: {
profile: '个人资料',
settings: '设置',
changePassword: '修改密码'
},
// 首页
dashboard: {
workOrderProcessing: '工单处理',
loadMore: '加载更多',
latestNews: '最新资讯',
allProjects: '所有项目',
financialNeedsAnalysisRecords: '财务需求分析记录',
noData: '暂无数据',
quickOperations: '快捷操作',
documents: '文档',
totalPremium: '总保费',
validPolicies: '有效保单数',
pendingCommissionPolicies: '待来佣保单',
financialCenter: '财务中心',
appointmentInformation: '预约信息',
newOrderFollowUp: '新单跟进',
policyInquiry: '保单查询',
renewalManagement: '续期管理',
customerManagement: '客户管理',
financialNeedsAnalysis: '财务需求分析',
userManual: '使用手册',
businessProcess: '业务流程',
companyIntroduction: '公司介绍',
contactInformation: '联系方式',
financialNeedsAnalysisCount: '财务需求分析数',
appointmentOrders: '预约单数',
newOrders: '新单数',
renewalPolicies: '续期保单数',
productDiscounts: '产品优惠',
productTraining: '产品培训',
importantNotice: '重要通知',
systemMessage: '系统消息',
renewalReminder: '续费提醒',
appointmentOrderGenerated: '预约单生成',
thisMonth: '本月',
lastThreeMonths: '近三个月',
lastYear: '近一年'
}
}
src/layout/components/Navbar.vue
...@@ -14,24 +14,8 @@ ...@@ -14,24 +14,8 @@
<top-nav v-if="settingsStore.topNav" id="topmenu-container" class="topmenu-container" /> <top-nav v-if="settingsStore.topNav" id="topmenu-container" class="topmenu-container" />
<div class="right-menu"> <div class="right-menu">
<!-- 添加租户选择器 --> <!-- 语言切换组件 只是引入还没具体实现 -->
<!-- <tenant-select class="right-menu-item hover-effect" v-if="userStore.tenants.length >= 1" />--> <!-- <lang-select class="right-menu-item" /> -->
<!-- <el-dropdown class="tenant-selector" @command="handleTenantChange">
<span class="el-dropdown-link">
{{ currentTenantName }}<el-icon class="el-icon--right"><arrow-down /></el-icon>
</span>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item
v-for="tenant in availableTenants"
:key="tenant.apiLoginTenantInfoResponse.tenantBizId"
:command="tenant"
>
{{ tenant.apiLoginTenantInfoResponse.tenantName }}
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown> -->
<template v-if="appStore.device !== 'mobile'"> <template v-if="appStore.device !== 'mobile'">
<header-search id="header-search" class="right-menu-item" /> <header-search id="header-search" class="right-menu-item" />
...@@ -105,6 +89,7 @@ import useSettingsStore from '@/store/modules/settings' ...@@ -105,6 +89,7 @@ import useSettingsStore from '@/store/modules/settings'
import { computed } from 'vue' import { computed } from 'vue'
import { ArrowDown } from '@element-plus/icons-vue' import { ArrowDown } from '@element-plus/icons-vue'
// import LangSelect from '@/components/LangSelect'
const appStore = useAppStore() const appStore = useAppStore()
const userStore = useUserStore() const userStore = useUserStore()
......
src/layout/components/Sidebar/index.vue
...@@ -42,6 +42,7 @@ const showLogo = computed(() => settingsStore.sidebarLogo) ...@@ -42,6 +42,7 @@ const showLogo = computed(() => settingsStore.sidebarLogo)
const sideTheme = computed(() => settingsStore.sideTheme) const sideTheme = computed(() => settingsStore.sideTheme)
const theme = computed(() => settingsStore.theme) const theme = computed(() => settingsStore.theme)
const isCollapse = computed(() => !appStore.sidebar.opened) const isCollapse = computed(() => !appStore.sidebar.opened)
console.log('sidebarRouters', sidebarRouters.value)
// 获取菜单背景色 // 获取菜单背景色
const getMenuBackground = computed(() => { const getMenuBackground = computed(() => {
...@@ -71,7 +72,7 @@ const activeMenu = computed(() => { ...@@ -71,7 +72,7 @@ const activeMenu = computed(() => {
<style lang="scss" scoped> <style lang="scss" scoped>
.sidebar-container { .sidebar-container {
background-color: v-bind(getMenuBackground); background-color: v-bind(getMenuBackground);
.scrollbar-wrapper { .scrollbar-wrapper {
background-color: v-bind(getMenuBackground); background-color: v-bind(getMenuBackground);
} }
...@@ -80,8 +81,9 @@ const activeMenu = computed(() => { ...@@ -80,8 +81,9 @@ const activeMenu = computed(() => {
border: none; border: none;
height: 100%; height: 100%;
width: 100% !important; width: 100% !important;
.el-menu-item, .el-sub-menu__title { .el-menu-item,
.el-sub-menu__title {
&:hover { &:hover {
background-color: var(--menu-hover, rgba(0, 0, 0, 0.06)) !important; background-color: var(--menu-hover, rgba(0, 0, 0, 0.06)) !important;
} }
...@@ -89,7 +91,7 @@ const activeMenu = computed(() => { ...@@ -89,7 +91,7 @@ const activeMenu = computed(() => {
.el-menu-item { .el-menu-item {
color: v-bind(getMenuTextColor); color: v-bind(getMenuTextColor);
&.is-active { &.is-active {
color: var(--menu-active-text, #409eff); color: var(--menu-active-text, #409eff);
background-color: var(--menu-hover, rgba(0, 0, 0, 0.06)) !important; background-color: var(--menu-hover, rgba(0, 0, 0, 0.06)) !important;
......
src/main.js
import { createApp } from 'vue' import { createApp } from 'vue'
import Cookies from 'js-cookie' import Cookies from 'js-cookie'
import i18n from './lang'
import ElementPlus from 'element-plus' import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css' import 'element-plus/dist/index.css'
import 'element-plus/theme-chalk/dark/css-vars.css' import 'element-plus/theme-chalk/dark/css-vars.css'
...@@ -27,7 +27,7 @@ import elementIcons from '@/components/SvgIcon/svgicon' ...@@ -27,7 +27,7 @@ import elementIcons from '@/components/SvgIcon/svgicon'
import './permission' // permission control import './permission' // permission control
import { useDict,useDictLists } from '@/utils/dict' import { useDict, useDictLists } from '@/utils/dict'
import { getConfigKey } from '@/api/system/config' import { getConfigKey } from '@/api/system/config'
import { import {
parseTime, parseTime,
...@@ -79,6 +79,7 @@ app.component('ImagePreview', ImagePreview) ...@@ -79,6 +79,7 @@ app.component('ImagePreview', ImagePreview)
app.component('RightToolbar', RightToolbar) app.component('RightToolbar', RightToolbar)
app.component('Editor', Editor) app.component('Editor', Editor)
// app.use(i18n) 语言切换
app.use(router) app.use(router)
app.use(store) app.use(store)
app.use(plugins) app.use(plugins)
...@@ -88,10 +89,12 @@ app.component('svg-icon', SvgIcon) ...@@ -88,10 +89,12 @@ app.component('svg-icon', SvgIcon)
directive(app) directive(app)
// 使用element-plus 并且设置全局的大小 // 使用element-plus 并且设置全局的大小
app.use(ElementPlus, { app.use(ElementPlus, {
locale: locale, locale: locale,
// 支持 large、default、small // 支持 large、default、small
size: Cookies.get('size') || 'default' size: Cookies.get('size') || 'default'
// i18n: i18n.global.t // 让 Element Plus 支持国际化
}) })
app.mount('#app') app.mount('#app')
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment