|
|
@@ -0,0 +1,245 @@
|
|
|
+<template>
|
|
|
+ <div class="notificationDetail">
|
|
|
+ <van-nav-bar title="对标考评公告详情" left-text="返回" @click-left="onClickLeft" />
|
|
|
+ <div class="mobeilVant">
|
|
|
+ <div class="mobeilTop">
|
|
|
+ <div class="topLeft">
|
|
|
+ <!-- <van-icon name="star" size="20" /> -->
|
|
|
+ <img :src="logoImg" alt="">
|
|
|
+ <span>全业务域考评系统</span>
|
|
|
+ </div>
|
|
|
+ <div class="topRight">
|
|
|
+ <span>系统导航</span>
|
|
|
+ <!-- <van-icon name="wap-nav" size="23" /> -->
|
|
|
+ <img :src="daohangImg" alt="" @click="chooseMenu">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="notificationDetailMain">
|
|
|
+ <div class="cssCommon">
|
|
|
+ <p>公告标题：</p>
|
|
|
+ <el-input v-model="ruleForm.noticeTitle" />
|
|
|
+ </div>
|
|
|
+ <div class="cssCommon">
|
|
|
+ <p>公告内容：</p>
|
|
|
+ <el-input v-model="ruleForm.noticeContent" type="textarea" :rows="10"></el-input>
|
|
|
+ </div>
|
|
|
+ <div class="cssCommon">
|
|
|
+ <p>发布对象：</p>
|
|
|
+ <el-input v-model="ruleForm.sendTo" />
|
|
|
+ </div>
|
|
|
+ <div class="cssCommon">
|
|
|
+ <p>排序：</p>
|
|
|
+ <el-input-number v-model="ruleForm.serialNumber" :min="1" />
|
|
|
+ </div>
|
|
|
+ <div class="cssCommon">
|
|
|
+ <p>附件：</p>
|
|
|
+ <el-table :data="filesListEdit" style="width: 100%">
|
|
|
+ <el-table-column label="附件名" prop="name" width="130" />
|
|
|
+ <el-table-column label="发送单位" prop="deptName" width="150" />
|
|
|
+ <el-table-column label="操作" width="100">
|
|
|
+ <template #default="scope">
|
|
|
+ <div @click="previewFile(scope.row)" style="cursor:pointer">
|
|
|
+ <img :src="yulan" style="margin-right: 10px;" >
|
|
|
+ <!-- <span style="font-size:14px">预览</span> -->
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import logoImg from '../assets/mobeilImg/logo.png'
|
|
|
+import daohangImg from '../assets/mobeilImg/daohang.png'
|
|
|
+import dateImg from '../assets/mobeilImg/date.png'
|
|
|
+import sortImg from '../assets/mobeilImg/sort.png'
|
|
|
+import seachImg from '../assets/mobeilImg/seach.png'
|
|
|
+import yulan from '../assets/btnIcon/yulan.png'
|
|
|
+
|
|
|
+import {apiGetevaluationdeptnoticeFilePreview} from '../api/api'
|
|
|
+
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ logoImg: logoImg,
|
|
|
+ daohangImg: daohangImg,
|
|
|
+ dateImg: dateImg,
|
|
|
+ sortImg: sortImg,
|
|
|
+ seachImg: seachImg,
|
|
|
+ yulan: yulan,
|
|
|
+ showDate: '',
|
|
|
+ binSection: '',
|
|
|
+ noticDetail: {},
|
|
|
+ ruleForm: {
|
|
|
+ serialNumber: 1,
|
|
|
+ noticeTitle: '',
|
|
|
+ noticeContent: '',
|
|
|
+ sendTo: '',
|
|
|
+ sendToContent: [],
|
|
|
+ releaseDept: '',
|
|
|
+ releasePeople: '',
|
|
|
+ },
|
|
|
+ filesListEdit: []
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ if (this.$route?.query?.rowObj) {
|
|
|
+ this.noticDetail = JSON.parse(this.$route.query.rowObj)
|
|
|
+ this.init(this.noticDetail)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ init(row) {
|
|
|
+ this.filesListEdit = []
|
|
|
+ this.ruleForm = {
|
|
|
+ serialNumber: row.serialNumber*1,
|
|
|
+ noticeTitle: row.noticeTitle,
|
|
|
+ noticeContent: row.noticeContent,
|
|
|
+ sendTo: row.sendTo,
|
|
|
+ sendToContent: row.sendToContent.split(','),
|
|
|
+ releaseDept: row.releaseDept,
|
|
|
+ releasePeople: row.releasePeople
|
|
|
+ }
|
|
|
+ if (row.noticeAnnex !== '') {
|
|
|
+ let filesArr = row.noticeAnnex.split(',')
|
|
|
+ let filesArrNew = []
|
|
|
+ filesArr.forEach(it => {
|
|
|
+ let obj = {
|
|
|
+ name: it,
|
|
|
+ deptName: row.releaseDeptName
|
|
|
+ }
|
|
|
+ filesArrNew.push(obj)
|
|
|
+ })
|
|
|
+ this.filesListEdit = filesArrNew
|
|
|
+ }
|
|
|
+ },
|
|
|
+ chooseMenu() {
|
|
|
+ this.$router.push({ path: "/menu"})
|
|
|
+ },
|
|
|
+ onClickLeft() {
|
|
|
+ this.$router.push({ path: "/notification"})
|
|
|
+ },
|
|
|
+ previewFile(it) {
|
|
|
+ // this.filesVisible = true
|
|
|
+ let params = {
|
|
|
+ url: it
|
|
|
+ }
|
|
|
+ apiGetevaluationdeptnoticeFilePreview(params).then(datas =>{
|
|
|
+ if (datas) {
|
|
|
+ // const blob = new Blob([datas], {type: 'application/pdf'})
|
|
|
+ // const url = URL.createObjectURL(blob)
|
|
|
+ // window.open(url)
|
|
|
+ // console.log('files', datas)
|
|
|
+ window.open(datas.data, 'target')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less">
|
|
|
+.notificationDetail {
|
|
|
+ background-color: #184FB4;
|
|
|
+ .van-nav-bar{
|
|
|
+ width: 100%;
|
|
|
+ background-color: #184FB4;
|
|
|
+ color: #fff;
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ z-index: 111111;
|
|
|
+ .van-nav-bar__content{
|
|
|
+ .van-nav-bar__left{
|
|
|
+ .van-nav-bar__text{
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .mobeilVant{
|
|
|
+ height: 100%;
|
|
|
+ margin-top: 45px;
|
|
|
+ border-radius: 10px 10px 0 0;
|
|
|
+ background-color: #fff;
|
|
|
+ .mobeilTop{
|
|
|
+ height: 60px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ .topLeft{
|
|
|
+ display: flex;
|
|
|
+ img{
|
|
|
+ width: 24px;
|
|
|
+ height: 28px;
|
|
|
+ position: relative;
|
|
|
+ top: 18px;
|
|
|
+ left: -10px;
|
|
|
+ }
|
|
|
+ span{
|
|
|
+ font-family: MicrosoftYaHei;
|
|
|
+ font-weight: 600;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #444950;
|
|
|
+ line-height: 60px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .topRight{
|
|
|
+ display: flex;
|
|
|
+ img{
|
|
|
+ width: 22px;
|
|
|
+ height: 18px;
|
|
|
+ position: relative;
|
|
|
+ top: 21px;
|
|
|
+ left: 5px;
|
|
|
+ }
|
|
|
+ span{
|
|
|
+ font-family: MicrosoftYaHei;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #545960;
|
|
|
+ line-height: 60px;
|
|
|
+ margin-right: 5px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .notificationDetailMain{
|
|
|
+ background-color: #ededf5;
|
|
|
+ padding: 17px 20px;
|
|
|
+ width: calc(100% - 40px);
|
|
|
+ .cssCommon{
|
|
|
+ margin-bottom: 20px;
|
|
|
+ p{
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ margin-bottom: 5px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-table{
|
|
|
+ .el-table__header-wrapper{
|
|
|
+ .el-table__header{
|
|
|
+ tr{
|
|
|
+ .cell{
|
|
|
+ line-height: 18px !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-table__body-wrapper{
|
|
|
+ .el-table__body{
|
|
|
+ tr{
|
|
|
+ .cell{
|
|
|
+ img{
|
|
|
+ width: 20px;
|
|
|
+ height: 14px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
