irc_web/src/views/trials/trials-notice/index.vue

285 lines
8.2 KiB
Vue

<template>
<BaseContainer>
<template slot="search-container">
<el-form :inline="true">
<!-- 通知类型 -->
<el-form-item :label="$t('trials:notice:table:notificationType')">
<el-select v-model="searchData.NoticeTypeEnum" 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="$t('trials:notice:table:notificationContent')">
<el-input
v-model="searchData.NoticeContent"
style="width: 100px"
clearable
/>
</el-form-item>
<!-- 通知状态 -->
<!-- <el-form-item label="通知状态: ">
<el-select v-model="searchData.NoticeStateEnum" placeholder="通知类型" clearable size="small">
<el-option
v-for="item of dict.type.NoticeState"
: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" @click="handleSearch">
{{ $t('common:button:search') }}
</el-button>
<el-button
type="primary"
icon="el-icon-refresh-left"
@click="handleReset"
>
{{ $t('common:button:reset') }}
</el-button>
</el-form-item>
</el-form>
</template>
<template slot="main-container">
<el-table
v-adaptive="{ bottomOffset: 60 }"
v-loading="loading"
:data="list"
stripe
height="100"
@sort-change="handleSortChange"
>
<el-table-column type="index" width="40" align="left" />
<el-table-column
prop="NoticeTypeEnum"
min-width="100"
:label="$t('trials:notice:table:notificationType')"
show-overflow-tooltip
sortable="custom"
>
<template slot-scope="scope">
{{ $fd('NoteType', scope.row.NoticeTypeEnum) }}
</template>
</el-table-column>
<el-table-column
prop="NoticeContent"
min-width="100"
:label="$t('trials:notice:table:notificationContent')"
show-overflow-tooltip
/>
<el-table-column
prop="NoticeStateEnum"
min-width="100"
:label="$t('trials:notice:table:notificationStatus')"
show-overflow-tooltip
sortable="custom"
>
<template slot-scope="scope">
<el-tag
:type="
scope.row.ActualNoticeStateEnum === 0
? 'info'
: scope.row.ActualNoticeStateEnum === 1
? 'success'
: 'error'
"
>
{{ $fd('NoticeState', scope.row.ActualNoticeStateEnum) }}
</el-tag>
</template>
</el-table-column>
<el-table-column
prop="PublishUserName"
min-width="100"
:label="$t('trials:notice:table:publisher')"
show-overflow-tooltip
sortable="custom"
/>
<el-table-column
prop="PublishedTime"
min-width="100"
:label="$t('trials:notice:table:releaseTime')"
show-overflow-tooltip
sortable="custom"
/>
<el-table-column
prop="EndDate"
min-width="100"
:label="$t('trials:notice:table:endTime')"
show-overflow-tooltip
sortable="custom"
/>
<el-table-column
prop="FileName"
min-width="100"
:label="$t('trials:notice:table:appendix')"
show-overflow-tooltip
sortable="custom"
>
<template slot-scope="scope">
<a
:href="OSSclientConfig.basePath + scope.row.Path"
target="_blank"
style="color: #428bca"
>{{ scope.row.FileName }}</a
>
</template>
</el-table-column>
<el-table-column
prop="IsRead"
min-width="100"
:label="$t('trials:notice:table:isRead')"
show-overflow-tooltip
sortable="custom"
>
<template slot-scope="scope">
<el-tag v-if="scope.row.IsRead">{{
$fd('YesOrNo', scope.row.IsRead)
}}</el-tag>
<el-tag v-else type="danger">{{
$fd('YesOrNo', scope.row.IsRead)
}}</el-tag>
</template>
</el-table-column>
<el-table-column
:label="$t('common:action:action')"
min-width="100"
fixed="right"
>
<template slot-scope="scope">
<el-button
circle
:title="$t('trials:notice:action:detail')"
icon="el-icon-info"
@click="showDetail(scope.row)"
/>
</template>
</el-table-column>
</el-table>
<!-- 分页组件 -->
<pagination
class="page"
:total="total"
:page.sync="searchData.PageIndex"
:limit.sync="searchData.PageSize"
@pagination="getList"
/>
</template>
</BaseContainer>
</template>
<script>
import { getUserSystemNoticeList, setSystemNoticeHaveRead } from '@/api/global'
import BaseContainer from '@/components/BaseContainer'
import Pagination from '@/components/Pagination'
const searchDataDefault = () => {
return {
NoticeContent: '',
NoticeTypeEnum: null,
NoticeLevelEnum: null,
ApplicableProjectEnum: null,
NoticeModeEnum: null,
NoticeStateEnum: null,
Asc: false,
SortField: 'PublishedTime',
PageIndex: 1,
PageSize: 20,
}
}
export default {
name: 'TrialsNotice',
components: { BaseContainer, Pagination },
dicts: ['NoteType', 'NoticeState', 'NoticeMode'],
data() {
return {
searchData: searchDataDefault(),
list: [],
total: 0,
loading: false,
}
},
mounted() {
this.getList()
},
methods: {
getList() {
this.loading = true
getUserSystemNoticeList(this.searchData)
.then((res) => {
this.loading = false
this.list = res.Result.CurrentPageData
this.total = res.Result.TotalCount
})
.catch(() => {
this.loading = false
})
},
showDetail(row) {
var currentNoticeType = this.$fd('NoteType', row.NoticeTypeEnum)
if (row.IsRead || row.ActualNoticeStateEnum !== 1) {
this.$alert(row.NoticeContent, currentNoticeType, {
showConfirmButton: false,
})
} else {
const h = this.$createElement
this.$msgbox({
title: currentNoticeType,
message: h('span', null, row.NoticeContent),
beforeClose: (action, instance, done) => {
if (action === 'confirm') {
instance.confirmButtonLoading = true
setSystemNoticeHaveRead(row.Id)
.then(async (res) => {
if (res.IsSuccess) {
await this.$store.dispatch('global/getNoticeList')
this.getList()
}
instance.confirmButtonLoading = false
done()
})
.catch(() => {
instance.confirmButtonLoading = false
})
} else {
done()
}
},
})
}
},
downLoadFile(filePath) {
if (!filePath) return
window.open(this.OSSclientConfig.basePath + filePath, '_blank')
},
handleSearch() {
this.searchData.PageIndex = 1
this.getList()
},
handleReset() {
this.searchData = searchDataDefault()
this.getList()
},
// 排序
handleSortChange(column) {
if (column.order === 'ascending') {
this.searchData.Asc = true
} else {
this.searchData.Asc = false
}
this.searchData.SortField = column.prop
this.searchData.PageIndex = 1
this.getList()
},
},
}
</script>
<style lang="scss" scoped>
</style>