[li_she]
4 years ago
7 changed files with 493 additions and 144 deletions
-
6src/api/sysLanguage.js
-
2src/views/main-navbar.vue
-
75src/views/modules/sys/language/common-language-base.vue
-
207src/views/modules/sys/language/common-language-list.vue
-
290src/views/modules/sys/language/common.vue
-
53src/views/modules/sys/menu-language.vue
-
4src/views/modules/sys/menu.vue
@ -0,0 +1,75 @@ |
|||
<template> |
|||
<el-dialog |
|||
width="350px" |
|||
title="语言" |
|||
:close-on-click-modal="false" |
|||
:visible.sync="visible"> |
|||
|
|||
<el-row v-for="(item,index) in dataList" |
|||
:key="item.columnProp" |
|||
:label="item.columnLabel" |
|||
:prop="item.columnProp"> |
|||
<el-col :span="4"> |
|||
|
|||
</el-col> |
|||
<el-col :span="4"> |
|||
{{ item.languageCode }} |
|||
</el-col> |
|||
<el-col :span="20"> |
|||
<el-input v-model="item.languageValue" controls-position="right" style="display:inline"></el-input> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<span slot="footer" class="dialog-footer"> |
|||
<el-button type="primary" @click="dataFormSubmit()"> {{ buttons.add }}</el-button> |
|||
<el-button @click="visible = false" type="primary">{{ buttons.close }}</el-button> |
|||
</span> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script> |
|||
import {searchBaseLanguageList, saveBaseObjectLanguageList} from '@/api/sysLanguage.js' |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
visible: false, |
|||
dataList: [], |
|||
buttons: { |
|||
add: '确认', |
|||
close: '关闭', |
|||
}, |
|||
} |
|||
}, |
|||
methods: { |
|||
init(val) { |
|||
this.visible = true |
|||
searchBaseLanguageList(val).then(({data}) => { |
|||
this.dataList = data.rows |
|||
}) |
|||
}, |
|||
// 获取数据列表 |
|||
getDataList() { |
|||
this.dataListLoading = false |
|||
}, |
|||
// 表单提交 |
|||
dataFormSubmit(val) { |
|||
saveBaseObjectLanguageList(this.dataList).then(({data}) => { |
|||
if (data.code == 0) { |
|||
this.$message.success(data.msg) |
|||
this.visible = false |
|||
} else { |
|||
this.$message.error(data.msg) |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
|
|||
.el-form-item--mini.el-form-item, .el-form-item--small.el-form-item { |
|||
margin-bottom: 5px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,207 @@ |
|||
<template> |
|||
<el-dialog |
|||
width="900px" |
|||
title="设置语言" |
|||
:close-on-click-modal="false" |
|||
:visible.sync="visible"> |
|||
<el-row > |
|||
<el-col :span="24"> |
|||
<el-form :inline="true" :model="addQuery" @keyup.enter.native="getDataList()"> |
|||
<el-form-item> |
|||
<el-input filterable v-model="addQuery.functionId" clearable> |
|||
</el-input> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-select filterable v-model="addQuery.languageCode" clearable> |
|||
<el-option :label="item.languageName" :value="item.languageCode" v-for="(item,index) in languageList " |
|||
:key="index"></el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button @click="getDataList()" type="primary">{{ buttons.search }}</el-button> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button @click="addListLanguage()" :disabled="dataListSelections.length <= 0" type="primary"> |
|||
{{ buttons.addList }} |
|||
</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
</el-col> |
|||
<el-col :span="24"> |
|||
<el-table |
|||
height="450" |
|||
:data="languageDataList" |
|||
border |
|||
v-loading="dataListLoading" |
|||
@selection-change="selectionChangeHandle" |
|||
style="width: 100%;"> |
|||
<el-table-column |
|||
type="selection" |
|||
header-align="center" |
|||
width="40" |
|||
align="center"> |
|||
</el-table-column> |
|||
<el-table-column |
|||
v-for="(item,index) in languageColumnList" :key="index" |
|||
:sortable="item.columnSortable" |
|||
:prop="item.columnProp" |
|||
:width="item.columnWidth" |
|||
:label="item.columnLabel"> |
|||
<template slot-scope="scope"> |
|||
<span v-if="item.columnProp!='languageValue'"> {{ scope.row[item.columnProp] }}</span> |
|||
<span v-if="item.columnProp=='languageValue'"><input |
|||
class="sl-input" |
|||
v-model="scope.row[item.columnProp]" type="text" |
|||
clearable></input></span> |
|||
</template> |
|||
</el-table-column> |
|||
|
|||
<el-table-column |
|||
fixed="right" |
|||
header-align="center" |
|||
align="center" |
|||
width="150" |
|||
:label="buttons.operate"> |
|||
<template slot-scope="scope"> |
|||
<a type="text" size="small" @click="saveLanguageList(scope.row)">添加</a> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<span slot="footer" class="dialog-footer"> |
|||
<el-button @click="visible = false" type="primary">{{ buttons.close }}</el-button> |
|||
</span> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
searchSysLanguage, |
|||
searchLanguageListByLanguageCode, |
|||
saveSysLanguageOne, |
|||
saveSysLanguageList |
|||
} from "@/api/sysLanguage.js" |
|||
import { |
|||
getTableDefaultListLanguage, |
|||
} from "@/api/table.js" |
|||
export default { |
|||
data() { |
|||
return { |
|||
visible: false, |
|||
dataList: [], |
|||
languageDataList: [], |
|||
dataListLoading: false, |
|||
languageColumnList: [], |
|||
dataListSelections: [], |
|||
languageList: [], |
|||
addQuery: { |
|||
functionId: '', |
|||
languageCode: '' |
|||
}, |
|||
buttons: { |
|||
settingLanguageList: '设置语言列表', |
|||
search: '查询', |
|||
addList: '批量添加', |
|||
add: '确认', |
|||
close: '关闭', |
|||
operate: '操作', |
|||
}, |
|||
} |
|||
}, |
|||
methods: { |
|||
init(val) { |
|||
this.visible = true |
|||
let query = { |
|||
functionId: 9001, |
|||
tableId: "common1002", |
|||
languageCode: this.$i18n.locale |
|||
} |
|||
getTableDefaultListLanguage(query).then(({data}) => { |
|||
if (data.rows.length > 0) { |
|||
this.languageColumnList = data.rows |
|||
this.getDataList() |
|||
} |
|||
}) |
|||
this.getLanguageList() |
|||
}, |
|||
// 获取多语言列表 |
|||
getLanguageList() { |
|||
searchSysLanguage({}).then(({data}) => { |
|||
this.languageList = data.rows |
|||
}) |
|||
}, |
|||
// 获取数据列表 |
|||
getDataList() { |
|||
this.dataListLoading = true |
|||
searchLanguageListByLanguageCode(this.addQuery).then(({data}) => { |
|||
this.languageDataList = data.rows |
|||
this.dataListLoading = false |
|||
}).catch(()=>{ |
|||
this.dataListLoading = false |
|||
}) |
|||
}, |
|||
// 多选 |
|||
selectionChangeHandle(val) { |
|||
this.dataListSelections = val |
|||
}, |
|||
// 单个保存语言编辑 |
|||
saveLanguageList(val) { |
|||
saveSysLanguageOne(val).then(({data}) => { |
|||
if (data.code == 0) { |
|||
this.$message.success(data.msg) |
|||
} else { |
|||
this.$message.error(data.msg) |
|||
} |
|||
}) |
|||
}, |
|||
// 批量保存 |
|||
addListLanguage() { |
|||
saveSysLanguageList(this.dataListSelections).then(({data}) => { |
|||
if (data.code == 0) { |
|||
this.$message.success(data.msg) |
|||
} else { |
|||
this.$message.error(data.msg) |
|||
} |
|||
}) |
|||
}, |
|||
// 获取 tableDefault 列 |
|||
getColumnList() { |
|||
getTableDefaultListLanguage(this.queryTable).then(({data}) => { |
|||
if (!data.rows.length == 0) { |
|||
this.showDefault = false |
|||
this.columnList = data.rows |
|||
} else { |
|||
this.showDefault = true |
|||
} |
|||
}) |
|||
}, |
|||
}, |
|||
created() { |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" > |
|||
|
|||
.el-form-item--mini.el-form-item, .el-form-item--small.el-form-item { |
|||
margin-bottom: 5px; |
|||
} |
|||
|
|||
.sl-input { |
|||
background-color: transparent; |
|||
border: 0 !important; |
|||
font-size: 12px !important; |
|||
height: 12px !important; |
|||
line-height: 14px !important; |
|||
background-color: transparent !important; |
|||
width: 140px; |
|||
} |
|||
.sl-input:focus, textarea:focus { |
|||
|
|||
outline: none; |
|||
|
|||
} |
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue