You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
123 lines
2.9 KiB
123 lines
2.9 KiB
|
2 years ago
|
<template>
|
||
|
|
<div>
|
||
|
|
<el-dialog :visible.sync="dialogVisible">
|
||
|
|
<template>
|
||
|
|
<xy-table ref="table" :row-key="row => row.id" :height="380" :action="index" :delay-req="true" :req-opt="select" :table-item="columns"></xy-table>
|
||
|
|
</template>
|
||
|
|
<template #footer>
|
||
|
|
<span>
|
||
|
|
<el-button size="mini" @click="dialogVisible = false">取 消</el-button>
|
||
|
|
<el-button size="mini" type="primary" @click="confirm">确 定</el-button>
|
||
|
|
</span>
|
||
|
|
</template>
|
||
|
|
</el-dialog>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { index } from "@/api/system/baseForm";
|
||
|
|
import { index as customFormIndex , show } from "@/api/system/customForm";
|
||
|
|
export default {
|
||
|
|
props: {
|
||
|
|
linkType: String,
|
||
|
|
linkTableName: String
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
dialogVisible: false,
|
||
|
|
select: {
|
||
|
|
table_name: '',
|
||
|
|
table_id: ''
|
||
|
|
},
|
||
|
|
columns: []
|
||
|
|
};
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
index,
|
||
|
|
show() {
|
||
|
|
this.dialogVisible = true;
|
||
|
|
},
|
||
|
|
hide() {
|
||
|
|
this.dialogVisible = false;
|
||
|
|
},
|
||
|
|
|
||
|
|
async getDataTableName () {
|
||
|
|
const tables = (await customFormIndex({
|
||
|
|
page: 1,
|
||
|
|
page_size: 999
|
||
|
|
}))?.data
|
||
|
|
|
||
|
|
const id = tables?.find(i => i.table_name === this.linkTableName)?.id
|
||
|
|
const res = (await show({
|
||
|
|
id
|
||
|
|
},false))?.relation[0]?.link_table_name
|
||
|
|
|
||
|
|
this.select.table_name = res
|
||
|
|
this.select.table_id = tables.find(i => i.table_name === this.select.table_name)?.id
|
||
|
|
},
|
||
|
|
async getColumns () {
|
||
|
|
const res = await show({
|
||
|
|
id: this.select.table_id
|
||
|
|
},false)
|
||
|
|
|
||
|
|
console.log(res)
|
||
|
|
this.columns = res.fields?.filter((i) => i.list_show).map(i => {
|
||
|
|
let linkOb = {};
|
||
|
|
|
||
|
|
if (i.select_item && typeof i.select_item === 'object' && !(i.select_item instanceof Array)) {
|
||
|
|
let keys = Object.keys(i.select_item)
|
||
|
|
linkOb.customFn = row => {
|
||
|
|
let paramMap = new Map()
|
||
|
|
keys.forEach(key => {
|
||
|
|
paramMap.set(i.select_item[key],key)
|
||
|
|
})
|
||
|
|
|
||
|
|
return (
|
||
|
|
<span>
|
||
|
|
{ paramMap.get(row[i.field]?.toString()) }
|
||
|
|
</span>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
return Object.assign(
|
||
|
|
{
|
||
|
|
prop: i.field,
|
||
|
|
label: i.name,
|
||
|
|
width: i.width,
|
||
|
|
fixed: i.is_fixed,
|
||
|
|
},
|
||
|
|
linkOb
|
||
|
|
)
|
||
|
|
})
|
||
|
|
this.columns.unshift({
|
||
|
|
type: 'index',
|
||
|
|
width: 50
|
||
|
|
})
|
||
|
|
|
||
|
|
if (this.linkType === 'hasMany' || this.linkType === 'newHasMany') {
|
||
|
|
this.columns.unshift({
|
||
|
|
type: 'selection',
|
||
|
|
width: 50,
|
||
|
|
reserveSelection: true
|
||
|
|
})
|
||
|
|
}
|
||
|
|
},
|
||
|
|
|
||
|
|
confirm () {
|
||
|
|
console.log(this.$refs['table'].getSelection())
|
||
|
|
this.dialogVisible = false;
|
||
|
|
}
|
||
|
|
},
|
||
|
|
computed: {},
|
||
|
|
watch: {
|
||
|
|
async linkTableName (newVal) {
|
||
|
|
await this.getDataTableName();
|
||
|
|
await this.getColumns();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped lang="scss"></style>
|