| | |
| | | <template> |
| | | <div class="notice-detail-page"> |
| | | <div class="notice-detail-head"> |
| | | <el-row :gutter="20"> |
| | | <el-col :xs="12" :sm="8" :md="6" :lg="4" :xl="4" style="margin-bottom: 16px;"></el-col> |
| | | </el-row> |
| | | <div class="head-item"> |
| | | <label>主题:</label> |
| | | <p></p> |
| | | </div> |
| | | <div class="head-item"> |
| | | <h4 style="margin-bottom: 16px;">{{ noticeInfo.theme }}</h4> |
| | | <p style="font-size: 12px;color: #999;margin-bottom: 20px;"> |
| | | <!-- <span>消息类型:审批 </span> --> |
| | | <span>发送人:{{ noticeInfo.createUser }} </span> |
| | | <span> </span> |
| | | <span>收件人:{{ noticeInfo.consigneeUser }}</span> |
| | | <span> </span> |
| | | <span>发件时间:{{ noticeInfo.createTime }}</span> |
| | | </p> |
| | | <div class="notice-detail-head-content"> |
| | | <label>内容:</label> |
| | | <p></p> |
| | | </div> |
| | | <div class="head-item"> |
| | | <label>发件时间:</label> |
| | | <p></p> |
| | | </div> |
| | | <div class="head-item"> |
| | | <label>发送人:</label> |
| | | <p></p> |
| | | </div> |
| | | <div class="head-item"> |
| | | <label>收件人:</label> |
| | | <p></p> |
| | | <div>{{ noticeInfo.content }}</div> |
| | | </div> |
| | | </div> |
| | | <component class="notice-content" :is="noticeInfo.u"> |
| | | </component> |
| | | <div class="info-box" v-if="noticeInfo.jumpPath"> |
| | | <component class="notice-content" :is="noticeInfo.jumpPath" style="height: 500px;" > |
| | | </component> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | components: comObj, |
| | | data() { |
| | | return{ |
| | | noticeInfo:{ |
| | | u:'b1-inspect-order-plan' |
| | | }, |
| | | noticeInfo:{}, |
| | | } |
| | | } |
| | | }, |
| | | created(){ |
| | | this.noticeInfo = JSON.parse(sessionStorage.getItem("noticeInfo")); |
| | | }, |
| | | mounted(){ |
| | | this.noticeInfo = JSON.parse(sessionStorage.getItem("noticeInfo")); |
| | | this.$bus.$on("change", (msg) => { |
| | | this.noticeInfo = JSON.parse(msg); |
| | | sessionStorage.setItem("noticeInfo", msg); |
| | | }); |
| | | }, |
| | | } |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .notice-detail-page{ |
| | | height: calc(100vh - 120px); |
| | | overflow-y: auto; |
| | | padding-top: 16px; |
| | | } |
| | | .notice-detail-head{ |
| | |
| | | box-sizing: border-box; |
| | | padding: 16px; |
| | | } |
| | | .notice-detail-head{ |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-between; |
| | | .info-box{ |
| | | margin-top: 16px; |
| | | width: 100%; |
| | | box-sizing: border-box; |
| | | padding: 8px 20px 20px; |
| | | background: rgba(148, 147, 147, 0.1); |
| | | border-radius: 8px; |
| | | } |
| | | .notice-detail-head-content div{ |
| | | border-radius: 8px; |
| | | border: 1px solid #ccc; |
| | | min-height: 60px; |
| | | width: 100%; |
| | | padding: 16px; |
| | | box-sizing: border-box; |
| | | margin-top: 12px; |
| | | } |
| | | </style> |