138 lines
2.6 KiB
Vue
138 lines
2.6 KiB
Vue
<template>
|
||
<t-dialog
|
||
v-model:visible="modelVisible"
|
||
attach="body"
|
||
:header="modelTitle"
|
||
width="1000"
|
||
:cancelBtn="null"
|
||
:confirm-on-enter="true"
|
||
:on-confirm="modelConfig"
|
||
>
|
||
<div class="GJSTModel">
|
||
<div class="title">
|
||
{{ modelData.title }}
|
||
</div>
|
||
<div class="remark">
|
||
<template v-for="(label, key) in remarkRule">
|
||
<div class="item" v-if="modelData[key]">
|
||
{{ label }}:{{ modelData[key] }}
|
||
</div>
|
||
</template>
|
||
</div>
|
||
<div
|
||
class="abstract"
|
||
style="color: #aaa"
|
||
v-if="modelData.trendSpeechLike || modelData.trendConsistentLike"
|
||
>
|
||
摘要：{{ modelData.trendSpeechLike || modelData.trendConsistentLike }}
|
||
</div>
|
||
<div class="content">
|
||
{{ modelData.content }}
|
||
</div>
|
||
|
||
<div class="liyou" style="color: #aaa" v-if="modelData.recommendReason">
|
||
推荐理由：{{ modelData.recommendReason }}
|
||
</div>
|
||
<div
|
||
class="liyou"
|
||
style="color: #aaa"
|
||
v-if="modelData.narrativeDirection"
|
||
>
|
||
叙事方向：{{ modelData.narrativeDirection }}
|
||
</div>
|
||
<div
|
||
class="liyou"
|
||
style="color: #aaa"
|
||
v-if="modelData.narrativeConstraints"
|
||
>
|
||
叙事限制：{{ modelData.narrativeConstraints }}
|
||
</div>
|
||
</div>
|
||
</t-dialog>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
modelVisible: false,
|
||
};
|
||
},
|
||
props: {
|
||
modelTitle: {
|
||
default: "详情",
|
||
},
|
||
remarkRule: {
|
||
default: {
|
||
direction: "方向",
|
||
importNum: "热度",
|
||
latitude: "纬度",
|
||
longitude: "经度",
|
||
siteName: "网站",
|
||
sourceType: "来源",
|
||
type: "类型",
|
||
date: "时间",
|
||
},
|
||
},
|
||
modelData: {
|
||
default: {},
|
||
},
|
||
modelStatus: {
|
||
default: false,
|
||
},
|
||
},
|
||
methods: {
|
||
modelConfig() {
|
||
this.$emit("config");
|
||
},
|
||
},
|
||
watch: {
|
||
modelStatus(v) {
|
||
console.log(v);
|
||
this.modelVisible = v;
|
||
},
|
||
modelVisible(v) {
|
||
this.$emit("updateStatus", v);
|
||
},
|
||
},
|
||
mounted() {
|
||
console.log(this.modelStatus);
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="less">
|
||
.CommonInfoDialog {
|
||
}
|
||
|
||
.GJSTModel {
|
||
color: #fff;
|
||
|
||
.title {
|
||
text-align: center;
|
||
font-size: 24px;
|
||
}
|
||
|
||
.remark {
|
||
color: #aaa;
|
||
margin: 10px;
|
||
display: flex;
|
||
justify-content: center;
|
||
gap: 10px;
|
||
|
||
.item {
|
||
}
|
||
}
|
||
|
||
.content {
|
||
font-size: 16px;
|
||
padding-bottom: 20px;
|
||
}
|
||
}
|
||
.abstract {
|
||
color: rgb(170, 170, 170);
|
||
font-size: 18px;
|
||
margin-bottom: 10px;
|
||
}
|
||
</style>
|