refactor: 删除tab表格系统组件
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…
Reference in New Issue