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.
60 lines
1.7 KiB
60 lines
1.7 KiB
<template> |
|
<el-collapse v-model="activeNames"> |
|
<el-collapse-item title="来信人基本情况" name="1"> |
|
<div class="flex"> |
|
<div class="col"> |
|
<label>姓名</label> |
|
<span>{{ mail.contactName }}</span> |
|
</div> |
|
<div class="col"> |
|
<label>性别</label> |
|
<span>{{ mail.contactSex === "M" ? "男" : "女" }}</span> |
|
</div> |
|
<div class="col"> |
|
<label>证件号码</label> |
|
<span>{{ mail.contactIdCard }}</span> |
|
</div> |
|
<div class="col"> |
|
<label>联系电话</label> |
|
<span>{{ mail.contactPhone }}</span> |
|
</div> |
|
</div> |
|
</el-collapse-item> |
|
<el-collapse-item title="来信反映主要问题" name="2"> |
|
<div class="content">{{ mail.content }}</div> |
|
<div style="margin: 2px"> |
|
<FileList :files="mail.attachments" v-if="mail.attachments && mail.attachments.length" /> |
|
</div> |
|
</el-collapse-item> |
|
</el-collapse> |
|
<ThreeHandlingDetail :mail="mail" /> |
|
</template> |
|
<script setup> |
|
import ThreeHandlingDetail from "./ThreeHandlingDetail.vue"; |
|
|
|
import { formatTimeText } from "@/utils/util"; |
|
|
|
defineProps({ |
|
mail: { |
|
type: Object, |
|
default: () => ({}), |
|
}, |
|
}); |
|
|
|
const activeNames = ref(["1", "2"]); |
|
</script> |
|
<style lang="scss" scoped> |
|
.el-collapse-item { |
|
--el-collapse-header-text-color: var(--primary-color); |
|
--el-collapse-header-font-size: 16px; |
|
} |
|
.col { |
|
width: 25%; |
|
label { |
|
width: 144px; |
|
text-align: right; |
|
} |
|
} |
|
|
|
|
|
</style> |