|
@@ -0,0 +1,315 @@
|
|
|
|
+<template>
|
|
|
|
+ <div style="height: 100%;">
|
|
|
|
+ <van-nav-bar
|
|
|
|
+ title="公告"
|
|
|
|
+ left-text="返回"
|
|
|
|
+ @click-left="$route_back()"
|
|
|
|
+ left-arrow
|
|
|
|
+ ></van-nav-bar>
|
|
|
|
+ <div class="body_com">
|
|
|
|
+ <scroller
|
|
|
|
+ ref="scroller"
|
|
|
|
+ :on-refresh="onRefresh"
|
|
|
|
+ :on-infinite="onInfinite"
|
|
|
|
+ >
|
|
|
|
+ <div class="message-box">
|
|
|
|
+ <div
|
|
|
|
+ @click="detail(item)"
|
|
|
|
+ class="message-item"
|
|
|
|
+ v-for="(item, index) in list"
|
|
|
|
+ :key="index"
|
|
|
|
+ >
|
|
|
|
+ <van-cell class="message-item-source">
|
|
|
|
+ <icon class="cell-item__icon" name="messageNotice" />
|
|
|
|
+ <span>{{ item.name }}</span>
|
|
|
|
+ <template slot="right-icon">
|
|
|
|
+ <span class="datetime">{{ item.create_time }}</span>
|
|
|
|
+ </template>
|
|
|
|
+ </van-cell>
|
|
|
|
+ <van-cell class="message-item-title" :border="false">
|
|
|
|
+ <span>{{ item.content }}</span>
|
|
|
|
+ </van-cell>
|
|
|
|
+ <van-cell is-link>
|
|
|
|
+ <span>查看详情</span>
|
|
|
|
+ <span class="labelf56c6c" v-show="item.cancel == 1">{{
|
|
|
|
+ item.cancel_text
|
|
|
|
+ }}</span>
|
|
|
|
+ </van-cell>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <noData
|
|
|
|
+ style="margin-top: 2rem;"
|
|
|
|
+ src="static/images/Notice.png"
|
|
|
|
+ :list="list"
|
|
|
|
+ detail_text="没有公告"
|
|
|
|
+ />
|
|
|
|
+ </scroller>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script>
|
|
|
|
+import moment from "moment";
|
|
|
|
+export default {
|
|
|
|
+ name: "informDetailP",
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ list: null,
|
|
|
|
+ cate: "",
|
|
|
|
+ db: null,
|
|
|
|
+ list_map: "",
|
|
|
|
+ testTime: "",
|
|
|
|
+ title: "",
|
|
|
|
+ page: 1
|
|
|
|
+ };
|
|
|
|
+ },
|
|
|
|
+ filters: {
|
|
|
|
+ msgTime(time) {
|
|
|
|
+ return moment(parseInt(time) * 1000).format("YYYY-MM-DD HH:mm");
|
|
|
|
+ },
|
|
|
|
+ testMsgTime(time) {
|
|
|
|
+ return moment(parseInt(time) * 1000).calendar(null, {
|
|
|
|
+ sameDay: "[今天] HH:mm",
|
|
|
|
+ lastDay: "[昨天] HH:mm",
|
|
|
|
+ lastWeek: "MM-DD HH:mm",
|
|
|
|
+ sameElse: function() {
|
|
|
|
+ if (
|
|
|
|
+ moment(moment().format("YYYY-MM-DD HH:mm")).diff(
|
|
|
|
+ moment(parseInt(time) * 1000).format("YYYY-MM-DD HH:mm"),
|
|
|
|
+ "years"
|
|
|
|
+ )
|
|
|
|
+ ) {
|
|
|
|
+ return "YYYY-MM-DD HH:mm";
|
|
|
|
+ } else {
|
|
|
|
+ return "MM-DD HH:mm";
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ created() {
|
|
|
|
+ this.setList();
|
|
|
|
+ },
|
|
|
|
+ activated() {
|
|
|
|
+ this.cate = this.$route.query.cate;
|
|
|
|
+ this.title = this.$route.query.title;
|
|
|
|
+ this.page = 1;
|
|
|
|
+ this.get_list(function() {});
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ // 设置已读信息
|
|
|
|
+ setList (done) {
|
|
|
|
+ this.$axiosUser('get', '/api/pro/notice/list', { cate:'information', page:1, page_size: 20, type: 1 }).then(res => {})
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ get_title(tpl) {
|
|
|
|
+ let title = tpl.find(o => {
|
|
|
|
+ return o.type == "title";
|
|
|
|
+ });
|
|
|
|
+ if (title) {
|
|
|
|
+ return title.value;
|
|
|
|
+ }
|
|
|
|
+ return "";
|
|
|
|
+ },
|
|
|
|
+ get_source(tpl) {
|
|
|
|
+ let source = tpl.find(o => {
|
|
|
|
+ return o.type == "source";
|
|
|
|
+ });
|
|
|
|
+ if (source) {
|
|
|
|
+ if (source.value == "公告福利") {
|
|
|
|
+ return "公告";
|
|
|
|
+ } else {
|
|
|
|
+ return source.value;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ return "";
|
|
|
|
+ },
|
|
|
|
+ get_content(tpl) {
|
|
|
|
+ let content = tpl.find(o => {
|
|
|
|
+ return o.type == "content";
|
|
|
|
+ });
|
|
|
|
+ if (content) {
|
|
|
|
+ return content.value;
|
|
|
|
+ }
|
|
|
|
+ return "";
|
|
|
|
+ },
|
|
|
|
+ get_point(tpl) {
|
|
|
|
+ for (let i in tpl) {
|
|
|
|
+ if (tpl[i].type == "point") {
|
|
|
|
+ return tpl[i].value;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ return 0;
|
|
|
|
+ },
|
|
|
|
+ get_feedback(tpl) {
|
|
|
|
+ for (let i in tpl) {
|
|
|
|
+ if (tpl[i].type == "feedback") {
|
|
|
|
+ return tpl[i].value;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ return "";
|
|
|
|
+ },
|
|
|
|
+ detail(item) {
|
|
|
|
+ // if (item.mini_program.index != '') {
|
|
|
|
+ // if(item.mini_program.index.indexOf("#")>=0){
|
|
|
|
+ // let url=item.mini_program.index.substring(item.mini_program.index.indexOf("#")+1)
|
|
|
|
+ // this.$router.push({
|
|
|
|
+ // path: url,
|
|
|
|
+ // query: item.mini_program.params
|
|
|
|
+ // })
|
|
|
|
+ // }else{
|
|
|
|
+ // this.$router.push({
|
|
|
|
+ // path: item.mini_program.index,
|
|
|
|
+ // query: item.mini_program.params
|
|
|
|
+ // })
|
|
|
|
+ // }
|
|
|
|
+ // // bulletin_welfare_detail
|
|
|
|
+ // // 写入当前被点击的记录ID
|
|
|
|
+ // localStorage.setItem('read_msg', item.id)
|
|
|
|
+ // }
|
|
|
|
+ this.$router.push({
|
|
|
|
+ name: "bulletin_welfare_detail",
|
|
|
|
+ query: {
|
|
|
|
+ id: item.id
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ // 获取未读信息
|
|
|
|
+ get_list(done) {
|
|
|
|
+ this.$axiosUser("get", "/api/pro/information/list/page", {
|
|
|
|
+ page: this.page,
|
|
|
|
+ page_size: 20
|
|
|
|
+ })
|
|
|
|
+ .then(res => {
|
|
|
|
+ if (res.data.code === 1) {
|
|
|
|
+ const { list } = res.data.data;
|
|
|
|
+ if (this.page === 1) {
|
|
|
|
+ this.list = list;
|
|
|
|
+ } else {
|
|
|
|
+ this.list = this.list.concat(list);
|
|
|
|
+ }
|
|
|
|
+ this.$refs.scroller.finishInfinite(res.data.data.list.length != 20); // 停止上滚加载下一页,由于服务器端没有统一空数据和正常数据的格式,所以通过total字段来判定数据是否存在下一页
|
|
|
|
+ } else {
|
|
|
|
+ this.$refs.scroller.finishInfinite(true);
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ .finally(() => {
|
|
|
|
+ done();
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ onRefresh(done) {
|
|
|
|
+ let self = this;
|
|
|
|
+ this.page = 1;
|
|
|
|
+ this.get_list(done);
|
|
|
|
+ },
|
|
|
|
+ onInfinite(done) {
|
|
|
|
+ this.page++;
|
|
|
|
+ this.get_list(done);
|
|
|
|
+ },
|
|
|
|
+ // 设置已读
|
|
|
|
+ read(ids) {
|
|
|
|
+ this.$axiosUser("post", "/api/pro/notice/read", { id: ids });
|
|
|
|
+ },
|
|
|
|
+ refresh(done) {
|
|
|
|
+ let self = this;
|
|
|
|
+ setTimeout(() => {
|
|
|
|
+ this.filter.page = 1;
|
|
|
|
+ this.get_list(function() {
|
|
|
|
+ self.list = [];
|
|
|
|
+ done();
|
|
|
|
+ });
|
|
|
|
+ }, 100);
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+};
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style scoped>
|
|
|
|
+.body_com {
|
|
|
|
+ height: calc(100% - 0.92rem);
|
|
|
|
+ position: relative;
|
|
|
|
+}
|
|
|
|
+/deep/ .body_com .van-hairline--top-bottom:after {
|
|
|
|
+ border: none;
|
|
|
|
+}
|
|
|
|
+/deep/ .body_com .van-hairline-unset--top-bottom:after {
|
|
|
|
+ border: none;
|
|
|
|
+}
|
|
|
|
+.message-box {
|
|
|
|
+ padding: 0.32rem;
|
|
|
|
+}
|
|
|
|
+/deep/ .message-item-content {
|
|
|
|
+ color: #909399;
|
|
|
|
+ font-size: 0.28rem;
|
|
|
|
+ padding-top: 0.1rem;
|
|
|
|
+}
|
|
|
|
+/deep/ .message-item-content .van-cell__value--alone {
|
|
|
|
+ color: #909399;
|
|
|
|
+}
|
|
|
|
+/deep/ .message-item-title .van-cell__value {
|
|
|
|
+ font-weight: bold;
|
|
|
|
+}
|
|
|
|
+.message-item-title {
|
|
|
|
+ padding-bottom: 0rem;
|
|
|
|
+}
|
|
|
|
+.message-item {
|
|
|
|
+ margin-bottom: 0.32rem;
|
|
|
|
+}
|
|
|
|
+/deep/ .message-item .van-icon.van-icon-volume-o {
|
|
|
|
+ line-height: 0.5rem;
|
|
|
|
+ text-align: center;
|
|
|
|
+ border-radius: 0.5rem;
|
|
|
|
+ background-color: #26a2ff;
|
|
|
|
+ color: #fff;
|
|
|
|
+ width: 0.5rem;
|
|
|
|
+ height: 0.5rem;
|
|
|
|
+ margin-right: 0.16rem;
|
|
|
|
+}
|
|
|
|
+.message-item-source {
|
|
|
|
+ background-color: #fafafa;
|
|
|
|
+}
|
|
|
|
+.message-item-source:after {
|
|
|
|
+ border: none;
|
|
|
|
+}
|
|
|
|
+.message-item /deep/ .datetime {
|
|
|
|
+ color: #909399;
|
|
|
|
+ font-size: 0.28rem;
|
|
|
|
+}
|
|
|
|
+.labelFF9600 {
|
|
|
|
+ color: #ff9600;
|
|
|
|
+ background-color: rgba(255, 150, 0, 0.3);
|
|
|
|
+ border-radius: 0.08rem;
|
|
|
|
+ padding: 0.06rem;
|
|
|
|
+}
|
|
|
|
+.label4bd964 {
|
|
|
|
+ font-size: 0.28rem;
|
|
|
|
+ background-color: #ddf7e1;
|
|
|
|
+ border-radius: 0.06rem;
|
|
|
|
+ padding: 0.06rem;
|
|
|
|
+ color: #4bd964;
|
|
|
|
+}
|
|
|
|
+.labelf56c6c {
|
|
|
|
+ font-size: 0.28rem;
|
|
|
|
+ background-color: #fbe7e7;
|
|
|
|
+ border-radius: 0.06rem;
|
|
|
|
+ padding: 0.06rem;
|
|
|
|
+ color: #f56c6c;
|
|
|
|
+}
|
|
|
|
+.colorFF2D55 {
|
|
|
|
+ color: #ff2d55;
|
|
|
|
+ font-weight: bold;
|
|
|
|
+ font-size: 0.4rem;
|
|
|
|
+}
|
|
|
|
+.color4BD964 {
|
|
|
|
+ color: #4bd964;
|
|
|
|
+ font-weight: bold;
|
|
|
|
+ font-size: 0.4rem;
|
|
|
|
+}
|
|
|
|
+/deep/ .datetime {
|
|
|
|
+ color: #909399;
|
|
|
|
+}
|
|
|
|
+.cell-item__icon {
|
|
|
|
+ width: 0.4rem;
|
|
|
|
+ height: 0.4rem;
|
|
|
|
+}
|
|
|
|
+</style>
|