fix: 修改国际化中的小bug
This commit is contained in:
parent
0736cdee4a
commit
303dd4fecf
@ -31,7 +31,7 @@ export default {
|
||||
placeholder: 'Please enter a user name to search for'
|
||||
},
|
||||
message: {
|
||||
updeteSuccess: 'update successfully'
|
||||
updateSuccess: 'update successfully'
|
||||
},
|
||||
driver: {
|
||||
doneBtnText: 'done',
|
||||
|
@ -31,7 +31,7 @@ export default {
|
||||
placeholder: '请输入搜索的用户姓名'
|
||||
},
|
||||
message: {
|
||||
updeteSuccess: '更新成功'
|
||||
updateSuccess: '更新成功'
|
||||
},
|
||||
driver: {
|
||||
doneBtnText: '完成',
|
||||
|
90
src/views/goods/components/tableList.vue
Normal file
90
src/views/goods/components/tableList.vue
Normal file
@ -0,0 +1,90 @@
|
||||
<template>
|
||||
<div class="m50">
|
||||
<div class="testTitle">默认横排</div>
|
||||
<el-table border :data="originData">
|
||||
<el-table-column label="行政区划" property="name" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column label="隶属" property="region" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column label="海拔" property="elevation" align="center">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!-- 转化后 -->
|
||||
<div class="testTitle">转化后</div>
|
||||
<el-table border :data="transData">
|
||||
<el-table-column
|
||||
v-for="(item, index) in transTitle"
|
||||
:label="item"
|
||||
:key="index"
|
||||
:index="index + ''"
|
||||
align="center"
|
||||
>
|
||||
<template v-slot="scope">
|
||||
{{ scope.row[index] }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onMounted, ref } from 'vue'
|
||||
|
||||
const originData = ref([
|
||||
({
|
||||
name: '湖北省武汉市某区',
|
||||
region: '武汉市',
|
||||
elevation: '150m'
|
||||
},
|
||||
{
|
||||
name: '湖北省武汉市某区',
|
||||
region: '黄石市',
|
||||
elevation: '200m'
|
||||
},
|
||||
{
|
||||
name: '湖北省武汉市某区',
|
||||
region: '荆州市',
|
||||
elevation: '200m'
|
||||
})
|
||||
])
|
||||
// originTitle 该标题为 正常显示的标题, 数组中的顺序就是上面数据源对象中的字段标题对应的顺序
|
||||
const originTitle = ref(['行政区划', '隶属', '海拔'])
|
||||
// transTitle 该标题为转化后的标题, 注意多一列, 因为原来的标题变成了竖着显示了, 所以多一列标题, 第一个为空即可
|
||||
const transTitle = ref(['字段名', '属性内容'])
|
||||
const transData = ref([])
|
||||
|
||||
onMounted(() => {
|
||||
// 数组按矩阵思路, 变成转置矩阵
|
||||
const matrixData = originData.value.map((row) => {
|
||||
const arr = []
|
||||
for (const key in row) {
|
||||
arr.push(row[key])
|
||||
}
|
||||
return arr
|
||||
})
|
||||
console.log(matrixData)
|
||||
// 加入标题拼接最终的数据
|
||||
transData.value = matrixData[0].map((col, i) => {
|
||||
return [
|
||||
originTitle.value[i],
|
||||
...matrixData.map((row) => {
|
||||
return row[i]
|
||||
})
|
||||
]
|
||||
})
|
||||
console.log(transData.value)
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.m50 {
|
||||
margin: 50px;
|
||||
}
|
||||
.testTitle {
|
||||
margin: 3vh 0;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
@ -1,7 +1,10 @@
|
||||
<template>
|
||||
<div>goods</div>
|
||||
<div>表格纵向表头测试</div>
|
||||
<Tablelist />
|
||||
</template>
|
||||
|
||||
<script setup></script>
|
||||
<script setup>
|
||||
import Tablelist from './components/tableList.vue'
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
|
@ -125,7 +125,7 @@ const handleConfirm = () => {
|
||||
: await editUser(ruleForm.value)
|
||||
ElMessage({
|
||||
// showClose: true,
|
||||
message: i18n.global.t('message.updeteSuccess'),
|
||||
message: i18n.global.t('message.updateSuccess'),
|
||||
type: 'success'
|
||||
})
|
||||
emits('initUserList')
|
||||
|
@ -121,7 +121,7 @@ const changeState = async (info) => {
|
||||
await changeUserState(info.id, info.mg_state)
|
||||
ElMessage({
|
||||
// showClose: true,
|
||||
message: i18n.t('message.updeteSuccess'),
|
||||
message: i18n.t('message.updateSuccess'),
|
||||
type: 'success'
|
||||
})
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user