286 lines
		
	
	
		
			11 KiB
		
	
	
	
		
			Plaintext
		
	
	
			
		
		
	
	
			286 lines
		
	
	
		
			11 KiB
		
	
	
	
		
			Plaintext
		
	
	
| <template>
 | |
|   <div class="role">
 | |
|     <div ref="leftContainer" class="left">
 | |
|       <el-form :inline="true">
 | |
|         <el-form-item label="通知级别: " prop="NoticeLevelEnum">
 | |
|           <el-select v-model="searchData.NoticeLevelEnum" placeholder="通知级别" clearable size="small">
 | |
|             <el-option
 | |
|               v-for="item of dict.type.NoteLevel"
 | |
|               :key="item.value"
 | |
|               :label="item.label"
 | |
|               :value="item.raw.Code * 1"
 | |
|             />
 | |
|           </el-select>
 | |
|         </el-form-item>
 | |
|         <el-form-item label="通知类型: " prop="NoticeTypeEnum">
 | |
|           <el-select v-model="searchData.NoticeTypeEnum" placeholder="通知类型" clearable size="small">
 | |
|             <el-option
 | |
|               v-for="item of dict.type.NoteType"
 | |
|               :key="item.value"
 | |
|               :label="item.label"
 | |
|               :value="item.raw.Code * 1"
 | |
|             />
 | |
|           </el-select>
 | |
|         </el-form-item>
 | |
|         <el-form-item label="适用项目: " prop="ApplicableProjectEnum">
 | |
|           <el-select v-model="searchData.ApplicableProjectEnum" placeholder="适用项目" clearable size="small">
 | |
|             <el-option
 | |
|               v-for="item of dict.type.NoticeApplicableTrial"
 | |
|               :key="item.value"
 | |
|               :label="item.label"
 | |
|               :value="item.raw.Code * 1"
 | |
|             />
 | |
|           </el-select>
 | |
|         </el-form-item>
 | |
|         <el-form-item label="使用角色: " prop="NoticeUserTypeIdList">
 | |
|           <el-select v-model="searchData.NoticeUserTypeIdList" multiple placeholder="使用角色" clearable size="small">
 | |
|             <el-option
 | |
|               v-for="item of roleList"
 | |
|               :key="item.Id"
 | |
|               :label="item.UserTypeShortName"
 | |
|               :value="item.Id"
 | |
|             />
 | |
|           </el-select>
 | |
|         </el-form-item>
 | |
|         <el-form-item label="提醒方式: " prop="NoticeModeEnum">
 | |
|           <el-select v-model="searchData.NoticeModeEnum" placeholder="提醒方式" clearable size="small">
 | |
|             <el-option
 | |
|               v-for="item of dict.type.NoticeMode"
 | |
|               :key="item.value"
 | |
|               :label="item.label"
 | |
|               :value="item.raw.Code * 1"
 | |
|             />
 | |
|           </el-select>
 | |
|         </el-form-item>
 | |
|         <el-form-item>
 | |
|           <el-button type="primary" icon="el-icon-search" size="mini" @click="getList">搜索</el-button>
 | |
|           <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
 | |
|         </el-form-item>
 | |
|       </el-form>
 | |
|       <el-table v-loading="loading" v-adaptive="{bottomOffset:45}" height="100" :data="list" class="table">
 | |
|         <el-table-column type="index" width="50" />
 | |
|         <el-table-column label="通知级别" prop="NoticeLevelEnum" min-width="120" show-overflow-tooltip>
 | |
|           <template slot-scope="scope">
 | |
|             {{ dict.type.NoteLevel.find(v => {return v.raw.Code * 1 === scope.row.NoticeLevelEnum}) ? dict.type.NoteLevel.find(v => {return v.raw.Code * 1 === scope.row.NoticeLevelEnum}).label : '' }}
 | |
|           </template>
 | |
|         </el-table-column>
 | |
|         <el-table-column label="通知类型" prop="NoticeTypeEnum" min-width="100" show-overflow-tooltip>
 | |
|           <template slot-scope="scope">
 | |
|             {{ dict.type.NoteType.find(v => {return v.raw.Code * 1 === scope.row.NoticeTypeEnum}) ? dict.type.NoteType.find(v => {return v.raw.Code * 1 === scope.row.NoticeTypeEnum}).label : '' }}
 | |
|           </template>
 | |
|         </el-table-column>
 | |
|         <el-table-column label="通知内容" prop="NoticeContent" min-width="100" show-overflow-tooltip>
 | |
|           <template slot-scope="scope">
 | |
|             {{ scope.row.NoticeContent }}
 | |
|           </template>
 | |
|         </el-table-column>
 | |
|         <el-table-column label="通知状态" prop="NoticeStateEnum" min-width="100" show-overflow-tooltip>
 | |
|           <template slot-scope="scope">
 | |
|             <el-tag :type="scope.row.ActualNoticeStateEnum === 0 ? 'info' : scope.row.ActualNoticeStateEnum === 1 ? 'success' : 'danger'">
 | |
|               {{ dict.type.NoticeState.find(v => {return v.raw.Code * 1 === scope.row.ActualNoticeStateEnum}) ? dict.type.NoticeState.find(v => {return v.raw.Code * 1 === scope.row.ActualNoticeStateEnum}).label : '' }}
 | |
|             </el-tag>
 | |
|           </template>
 | |
|         </el-table-column>
 | |
|         <el-table-column label="适用项目" prop="ApplicableProjectEnum" min-width="100" show-overflow-tooltip>
 | |
|           <template slot-scope="scope">
 | |
|             {{ dict.type.NoticeApplicableTrial.find(v => {return v.raw.Code * 1 === scope.row.ApplicableProjectEnum}) ? dict.type.NoticeApplicableTrial.find(v => {return v.raw.Code * 1 === scope.row.ApplicableProjectEnum}).label : '' }}
 | |
|           </template>
 | |
|         </el-table-column>
 | |
|         <el-table-column label="适用角色" prop="NoticeUserTypeList" min-width="80" show-overflow-tooltip>
 | |
|           <template slot-scope="scope">
 | |
|             {{ scope.row.NoticeUserTypeList.map(v => v.UserTypeShortName).toString() }}
 | |
|           </template>
 | |
|         </el-table-column>
 | |
|         <el-table-column label="提示方式" prop="NoticeModeEnum" min-width="100" show-overflow-tooltip>
 | |
|           <template slot-scope="scope">
 | |
|             {{ dict.type.NoticeMode.find(v => {return v.raw.Code * 1 === scope.row.NoticeModeEnum}) ? dict.type.NoticeMode.find(v => {return v.raw.Code * 1 === scope.row.NoticeModeEnum}).label : '' }}
 | |
|           </template>
 | |
|         </el-table-column>
 | |
|         <el-table-column label="保留时长" prop="StartDate" min-width="240" show-overflow-tooltip>
 | |
|           <template slot-scope="scope">
 | |
|             {{ scope.row.StartDate }}-{{ scope.row.EndDate }}
 | |
|           </template>
 | |
|         </el-table-column>
 | |
|         <el-table-column label="发布人" prop="PublishUserName" min-width="100" show-overflow-tooltip />
 | |
|         <el-table-column label="发布时间" prop="PublishedTime" min-width="160" show-overflow-tooltip />
 | |
|         <el-table-column label="更新时间" prop="UpdateTime" min-width="160" show-overflow-tooltip>
 | |
|           <template slot-scope="scope">
 | |
|             {{ scope.row.StartDate ? scope.row.StartDate: scope.row.CreateTime }}
 | |
|           </template>
 | |
|         </el-table-column>
 | |
|         <el-table-column label="附件" fixed="right" prop="FileName" min-width="120" show-overflow-tooltip>
 | |
|           <template slot-scope="scope">
 | |
|             <a :href="OSSclientConfig.basePath + scope.row.FullFilePath" target="_blank" style="color:#428bca">{{ scope.row.FileName }}</a>
 | |
|           </template>
 | |
|         </el-table-column>
 | |
|         <el-table-column label="操作" fixed="right" prop="UserTypeShortName" min-width="200" show-overflow-tooltip>
 | |
|           <template slot-scope="scope">
 | |
|             <el-button
 | |
|               size="mini"
 | |
|               type="text"
 | |
|               icon="el-icon-edit-outline"
 | |
|               @click="handleEdit(scope.row)"
 | |
|             >编辑</el-button>
 | |
|             <el-button
 | |
|               v-if="scope.row.NoticeStateEnum === 0"
 | |
|               size="mini"
 | |
|               type="text"
 | |
|               icon="el-icon-s-promotion"
 | |
|               @click="handlePush(scope.row)"
 | |
|             >发布</el-button>
 | |
|             <el-button
 | |
|               v-if="scope.row.NoticeStateEnum === 1"
 | |
|               size="mini"
 | |
|               type="text"
 | |
|               icon="el-icon-s-release"
 | |
|               @click="handleGet(scope.row)"
 | |
|             >撤回</el-button>
 | |
|           </template>
 | |
|         </el-table-column>
 | |
|       </el-table>
 | |
|       <div class="pagination" style="text-align: right;margin-top:5px;">
 | |
|         <pagination :total="total" :page.sync="searchData.PageIndex" :limit.sync="searchData.PageSize" @pagination="getList" />
 | |
|       </div>
 | |
|     </div>
 | |
|     <notice-form ref="NoticeForm" :role-list="roleList" @getList="getList" />
 | |
|   </div>
 | |
| </template>
 | |
| <script>
 | |
| import { getSystemNoticeList, addOrUpdateSystemNotice } from '@/api/system/notice'
 | |
| import { getUserTypeRoleList } from '@/api/admin'
 | |
| import NoticeForm from './components/from'
 | |
| import Pagination from '@/components/Pagination'
 | |
| const searchDataDefault = () => {
 | |
|   return {
 | |
|     Asc: true,
 | |
|     SortField: '',
 | |
|     NoticeContent: null,
 | |
|     FileName: null,
 | |
|     NoticeTypeEnum: null,
 | |
|     NoticeLevelEnum: null,
 | |
|     ApplicableProjectEnum: null,
 | |
|     NoticeModeEnum: null,
 | |
|     NoticeStateEnum: null,
 | |
|     PageIndex: 1,
 | |
|     PageSize: 20
 | |
|   }
 | |
| }
 | |
| export default {
 | |
|   components: { NoticeForm, Pagination },
 | |
|   dicts: ['NoticeApplicableTrial', 'NoteLevel', 'NoteType', 'NoticeState', 'NoticeMode'],
 | |
|   data() {
 | |
|     return {
 | |
|       list: [],
 | |
|       total: 0,
 | |
|       loading: false,
 | |
|       treeData: [],
 | |
|       defaultProps: {
 | |
|         label: 'MenuName',
 | |
|         children: 'Children'
 | |
|       },
 | |
|       userList: [],
 | |
|       roleList: [],
 | |
|       // 查询参数
 | |
|       searchData: searchDataDefault(),
 | |
|       dialogVisible: false,
 | |
|       editRow: {},
 | |
|       expandedKeys: [],
 | |
|       treeLoading: false,
 | |
|       funcListLoading: false,
 | |
|       funcList: []
 | |
|     }
 | |
|   },
 | |
|   mounted() {
 | |
|     this.getUserTypeRoleList()
 | |
|     this.getList()
 | |
|   },
 | |
|   methods: {
 | |
|     handlePush(row) {
 | |
|       this.loading = true
 | |
|       var params = { ...row }
 | |
|       params.NoticeUserTypeIdList = params.NoticeUserTypeList.map(v => v.Id)
 | |
|       params.NoticeStateEnum = 1
 | |
|       addOrUpdateSystemNotice(params).then(res => {
 | |
|         this.loading = false
 | |
|         this.$message.success('发布成功')
 | |
|         this.getList()
 | |
|       }).catch(() => { this.loading = false })
 | |
|     },
 | |
|     handleGet(row) {
 | |
|       this.loading = true
 | |
|       var params = { ...row }
 | |
|       params.NoticeUserTypeIdList = params.NoticeUserTypeList.map(v => v.Id)
 | |
|       params.NoticeStateEnum = 0
 | |
|       addOrUpdateSystemNotice(params).then(res => {
 | |
|         this.loading = false
 | |
|         this.$message.success('撤回成功')
 | |
|         this.getList()
 | |
|       }).catch(() => { this.loading = false })
 | |
|     },
 | |
|     handleEdit(row) {
 | |
|       this.$nextTick(() => {
 | |
|         this.$refs['NoticeForm'].openDialog('编辑', row)
 | |
|       })
 | |
|     },
 | |
|     handleAdd() {
 | |
|       this.$nextTick(() => {
 | |
|         this.$refs['NoticeForm'].openDialog('新增', {})
 | |
|       })
 | |
|     },
 | |
|     getUserTypeRoleList() {
 | |
|       getUserTypeRoleList({}).then((res) => {
 | |
|         this.roleList = res.Result
 | |
|       }).catch(() => {
 | |
|       })
 | |
|     },
 | |
|     getList() {
 | |
|       this.loading = true
 | |
|       getSystemNoticeList(this.searchData).then((res) => {
 | |
|         this.loading = false
 | |
|         this.list = res.Result.CurrentPageData
 | |
|         this.total = res.Result.TotalCount
 | |
|       }).catch(() => {
 | |
|         this.loading = false
 | |
|       })
 | |
|     }
 | |
|   }
 | |
| }
 | |
| </script>
 | |
| <style lang="scss">
 | |
|   .role {
 | |
|     height: 100%;
 | |
|     box-sizing: border-box;
 | |
|     display: flex;
 | |
|     padding: 10px;
 | |
|     border-radius: 5px;
 | |
|     .left {
 | |
|       display: flex;
 | |
|       flex-direction: column;
 | |
|       width: 0;
 | |
|       flex-grow: 4;
 | |
|       // border-right: 1px solid #ccc;
 | |
|       .filter-container {
 | |
|         display: flex;
 | |
|         align-items: center;
 | |
|         margin: 5px;
 | |
|       }
 | |
|       .data-table {
 | |
|         flex: 1;
 | |
|         padding: 5px 0px;
 | |
|       }
 | |
|       .pagination-container {
 | |
|         text-align: right;
 | |
|       }
 | |
|     }
 | |
|     .right {
 | |
|       width: 0;
 | |
|       flex-grow: 6;
 | |
|       overflow-y: auto;
 | |
|       border-right: 1px solid #ccc;
 | |
|     }
 | |
|     .selected-row{
 | |
|       background-color: cadetblue;
 | |
|     }
 | |
|   }
 | |
| </style>
 |