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

284 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 $d.NoteType"
:key="item.id"
:label="item.label"
:value="item.value"
/>
</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: true,
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(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>