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.
117 lines
2.4 KiB
117 lines
2.4 KiB
<template>
|
|
<div>
|
|
<el-drawer
|
|
ref="elDrawer"
|
|
:title="detail.name || '详情'"
|
|
:visible.sync="isShow"
|
|
size="45%"
|
|
direction="rtl"
|
|
>
|
|
<template>
|
|
<el-descriptions
|
|
size="medium"
|
|
direction="vertical"
|
|
:column="3"
|
|
:labelStyle="{ 'font-weight': '600', width: '33%' }"
|
|
:content-style="{ width: '33%' }"
|
|
border
|
|
style="margin: 20px 10px"
|
|
>
|
|
<template v-for="info in formInfo">
|
|
<el-descriptions-item :label="info.name">{{
|
|
contentFormat(info)
|
|
}}</el-descriptions-item>
|
|
</template>
|
|
</el-descriptions>
|
|
</template>
|
|
</el-drawer>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { show } from "@/api/system/baseForm";
|
|
export default {
|
|
props: {
|
|
formInfo: {
|
|
type: Array,
|
|
default: () => [],
|
|
},
|
|
tableName: String,
|
|
},
|
|
data() {
|
|
return {
|
|
id: "",
|
|
isShow: false,
|
|
|
|
detail: {},
|
|
};
|
|
},
|
|
methods: {
|
|
show() {
|
|
this.isShow = true;
|
|
},
|
|
hidden() {
|
|
this.isShow = false;
|
|
},
|
|
setId(id) {
|
|
if (typeof id == "number") {
|
|
this.id = id;
|
|
} else {
|
|
console.error("error typeof id: " + typeof id);
|
|
}
|
|
},
|
|
getId() {
|
|
return this.id;
|
|
},
|
|
},
|
|
computed: {
|
|
contentFormat() {
|
|
return function (i) {
|
|
if (i.parameter_id) {
|
|
return this.detail[i.link_with_name]?.value;
|
|
}
|
|
if (i.link_table_name) {
|
|
if (i.link_relation === "hasOne") {
|
|
return (
|
|
this.detail[i.link_with_name]?.name ||
|
|
this.detail[i.link_with_name]?.no ||
|
|
this.detail[i.link_with_name]?.value
|
|
);
|
|
}
|
|
if (i.link_relation === "hasMany") {
|
|
return this.detail[i.link_with_name]
|
|
?.map((o) => o?.name || o?.no || o?.value)
|
|
?.toString();
|
|
}
|
|
}
|
|
|
|
return this.detail[i.field]
|
|
};
|
|
},
|
|
},
|
|
watch: {
|
|
isShow(newVal) {
|
|
if (newVal) {
|
|
show(
|
|
{
|
|
table_name: this.tableName,
|
|
id: this.id,
|
|
},
|
|
true
|
|
).then((res) => {
|
|
console.log(111, res);
|
|
this.detail = res;
|
|
});
|
|
}
|
|
},
|
|
},
|
|
mounted() {},
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.btns {
|
|
margin: 0 10px 12px 10px;
|
|
}
|
|
</style>
|