refactor: 删除tab表格系统组件

main
wu.jian2 1 year ago
parent f22c64fd68
commit 4bef6cbf27

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

@ -1,82 +0,0 @@
const title = 'tab表格'
// 右侧配置项
const setting = [
{
label: '维度',
// 设置组件类型, select / input / colorPicker
type: 'select',
// 字段
field: 'xField',
optionField: 'xField', // 对应options中的字段
// 是否多选
multiple: false,
// 绑定的值
value: '',
// tab页。 data: 数据, custom: 自定义
tabName: 'data'
},
{
label: '指标',
// 设置组件类型
type: 'select',
// 字段
field: 'yField',
// 对应options中的字段
optionField: 'yField',
// 是否多选
multiple: false,
value: '',
tabName: 'data'
},
{
label: '用户名',
// 设置组件类型, select / input / colorPicker
type: 'input',
// 字段
field: 'customize_username',
optionField: 'customize.username', // 对应options中的字段
// 是否多选
multiple: false,
// 绑定的值
value: '',
// tab页。 data: 数据, custom: 自定义
tabName: 'custom'
},
{
label: '手机号',
// 设置组件类型, select / input / colorPicker
type: 'input',
// 字段
field: 'customize_phone',
optionField: 'customize.phone', // 对应options中的字段
// 是否多选
multiple: false,
// 绑定的值
value: '',
// tab页。 data: 数据, custom: 自定义
tabName: 'custom'
}
]
// 模拟数据
const data = []
const option = {
// 数据
data: data,
// 数据的字段相关属性
xField: '',
yField: '',
seriesField: '',
// 自定义组件其他属性
customize: {
username: '张三',
phone: '123456789'
}
}
export default {
title,
option,
setting
}

@ -1,107 +0,0 @@
<template>
<div class="tab-table-wrap">
<el-tabs
v-model="activeName"
@tab-click="handleClick"
>
<el-tab-pane
label="城市管理"
name="first"
>
<el-table
:data="tableData"
style="width: 100%"
>
<el-table-column
prop="name"
label="城市"
width="180"
/>
<el-table-column
prop="number"
label="数量"
/>
</el-table>
<el-tab-pane
label="用户信息"
name="second"
>
<el-descriptions title="用户信息">
<el-descriptions-item label="用户名">
{{ customize.username }}
</el-descriptions-item>
<el-descriptions-item label="手机号">
{{ customize.phone }}
</el-descriptions-item>
</el-descriptions>
</el-tab-pane>
<el-tab-pane
label="角色管理"
name="third"
>
角色管理
</el-tab-pane>
<el-tab-pane
label="定时任务补偿"
name="fourth"
>
定时任务补偿
</el-tab-pane>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
export default {
data () {
return {
activeName: 'first'
}
},
props: {
config: {
type: Object,
default: () => ({})
}
},
computed: {
option () {
return this.config.option
},
optionData () {
return this.option.data
},
customize () {
return this.option.customize
},
tableData () {
if (this.optionData && this.optionData.length) {
return this.optionData.map((item) => ({
name: item[this.option.xField],
number: item[this.option.yField]
}))
}
return []
}
},
methods: {
handleClick (tab, event) {
},
linkage (row) {
this.$emit('linkage', row)
}
}
}
</script>
<style lang="scss" scoped>
.tab-table-wrap {
padding: 16px;
font-size: 20px;
position: absolute;
width: 100%;
height: 100%;
background: #fff;
}
</style>
Loading…
Cancel
Save