dai
3 years ago
25 changed files with 729 additions and 285 deletions
Binary file not shown.
Binary file not shown.
@ -0,0 +1,303 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<div class="m-tx"> |
||||
|
<div class="wrap"> |
||||
|
<div class="header"> |
||||
|
<div class="title">全部提醒</div> |
||||
|
<div class="btn-clear" @click="read"> |
||||
|
<img src="~@/assets/images/main/clear.png" /> |
||||
|
全部标记已读 |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="cnt" v-if="noticeData.length > 0"> |
||||
|
<div |
||||
|
@click="handleClickNotice(item, index)" |
||||
|
:class="{ 'z-readed': item.readFlag == 1 }" |
||||
|
class="item" |
||||
|
:key="'notice' + item.targetId + index" |
||||
|
v-for="(item, index) in noticeData" |
||||
|
> |
||||
|
<i class="i-tag" v-if="item.readFlag == 1">已读</i> |
||||
|
<i class="i-tag" v-else>未读</i> |
||||
|
<div class="item-title"> |
||||
|
{{ item.content }} |
||||
|
</div> |
||||
|
<div |
||||
|
v-if="item.readFlag != 1" |
||||
|
@click.stop="read(item)" |
||||
|
class="item-btn-clear" |
||||
|
> |
||||
|
<img src="~@/assets/images/main/clear.png" /> |
||||
|
标记已读 |
||||
|
</div> |
||||
|
<div class="item-date">{{ item.createdTime }}</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="cnt" v-else> |
||||
|
<div class="empty"> |
||||
|
<img |
||||
|
src="~@/assets/images/shuju/renfang/index/empty.png" |
||||
|
/> |
||||
|
<span>暂无提醒～</span> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div> |
||||
|
<el-pagination |
||||
|
@size-change="handleSizeChange" |
||||
|
@current-change="handleCurrentChange" |
||||
|
:current-page.sync="pageNo" |
||||
|
:page-sizes="[20, 50, 100, 200]" |
||||
|
:page-size="parseInt(pageSize)" |
||||
|
layout="sizes, prev, pager, next, total" |
||||
|
:total="total" |
||||
|
> |
||||
|
</el-pagination> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<fastcall ref="fastcall" /> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { requestGet, requestPost } from "@/js/dai/request"; |
||||
|
import nextTick from "dai-js/tools/nextTick"; |
||||
|
import fastcall from "@/views/modules/cpts/fastcall"; |
||||
|
|
||||
|
export default { |
||||
|
components: { fastcall }, |
||||
|
|
||||
|
data() { |
||||
|
return { |
||||
|
type: "all", |
||||
|
pageNo: 1, |
||||
|
pageSize: window.localStorage.getItem("pageSize") || 20, |
||||
|
total: 1, |
||||
|
noticeData: [], |
||||
|
}; |
||||
|
}, |
||||
|
computed: {}, |
||||
|
watch: {}, |
||||
|
activated() { |
||||
|
this.getList(); |
||||
|
}, |
||||
|
methods: { |
||||
|
handleClickNotice(item, index) { |
||||
|
const { msgType, targetId } = item; |
||||
|
if (msgType == "community_house") { |
||||
|
this.$refs.fastcall.showHouseInfo(targetId); |
||||
|
} else if (msgType == "resident_base_info") { |
||||
|
this.$refs.fastcall.showResiInfo(targetId); |
||||
|
} |
||||
|
this.read(item, index); |
||||
|
}, |
||||
|
|
||||
|
async read(item, index) { |
||||
|
if (item && item.readFlag == 1) return; |
||||
|
|
||||
|
const url = "/message/intelligentMessage/msg/clear"; |
||||
|
let params = {}; |
||||
|
|
||||
|
if (item.id) { |
||||
|
params.id = item.id; |
||||
|
} |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, params); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
console.log("消息已读"); |
||||
|
this.getList(); |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
handleClickTab(type) { |
||||
|
console.log(type); |
||||
|
this.getList(); |
||||
|
}, |
||||
|
handleSizeChange(val) { |
||||
|
this.pageSize = val; |
||||
|
localStorage.setItem("pageSize", val); |
||||
|
this.getList(); |
||||
|
}, |
||||
|
handleCurrentChange(val) { |
||||
|
this.pageNo = val; |
||||
|
this.getList(); |
||||
|
}, |
||||
|
//加载组织数据 |
||||
|
async getList() { |
||||
|
const url = "/message/intelligentMessage/page"; |
||||
|
let params = { |
||||
|
page: this.pageNo, |
||||
|
limit: this.pageSize, |
||||
|
}; |
||||
|
const { type } = this; |
||||
|
if (type == "readed") { |
||||
|
params.readFlag = 1; |
||||
|
} else if (type == "unreaded") { |
||||
|
params.readFlag = 0; |
||||
|
} |
||||
|
|
||||
|
const { data, code, msg } = await requestGet(url, params); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.total = data.total; |
||||
|
this.noticeData = data.list; |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
@import "~@/assets/scss/c/function.scss"; |
||||
|
|
||||
|
.m-tx { |
||||
|
position: relative; |
||||
|
margin: 10px 6px; |
||||
|
padding: 12px 20px; |
||||
|
background: #ffffff; |
||||
|
box-shadow: 0px 6px 16px 0px rgba(0, 0, 0, 0.08), |
||||
|
0px 3px 6px -4px rgba(0, 0, 0, 0.12); |
||||
|
border-radius: 2px; |
||||
|
|
||||
|
.cnt { |
||||
|
box-sizing: border-box; |
||||
|
border-radius: 2px; |
||||
|
overflow: hidden; |
||||
|
padding: 0 12px; |
||||
|
|
||||
|
.empty { |
||||
|
margin: 100px 0; |
||||
|
text-align: center; |
||||
|
color: #999; |
||||
|
img { |
||||
|
display: block; |
||||
|
width: 120px; |
||||
|
margin: 20px auto; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.z-readed { |
||||
|
opacity: 0.5; |
||||
|
} |
||||
|
|
||||
|
.item { |
||||
|
position: relative; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
padding: 16px 0 12px; |
||||
|
border-bottom: 1px dashed #f0f5fa; |
||||
|
&:last-child { |
||||
|
border-bottom: none; |
||||
|
} |
||||
|
|
||||
|
&:hover { |
||||
|
.item-title { |
||||
|
color: #0056d6; |
||||
|
} |
||||
|
.item-btn-clear { |
||||
|
display: block; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.i-tag { |
||||
|
display: block; |
||||
|
margin-right: 15px; |
||||
|
width: 40px; |
||||
|
height: 22px; |
||||
|
border-radius: 4px; |
||||
|
border: 1px solid rgba(0, 0, 0, 0.15); |
||||
|
font-size: 12px; |
||||
|
font-family: PingFangSC-Regular, PingFang SC; |
||||
|
font-weight: 400; |
||||
|
color: rgba(0, 0, 0, 0.88); |
||||
|
line-height: 20px; |
||||
|
font-style: normal; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.item-title { |
||||
|
// @include toe; |
||||
|
width: 60%; |
||||
|
margin-right: 100px; |
||||
|
font-size: 14px; |
||||
|
font-family: PingFangSC-Regular, PingFang SC; |
||||
|
font-weight: 400; |
||||
|
color: rgba(0, 0, 0, 0.85); |
||||
|
line-height: 22px; |
||||
|
} |
||||
|
|
||||
|
.item-btn-clear { |
||||
|
position: absolute; |
||||
|
display: none; |
||||
|
top: 50%; |
||||
|
left: 65%; |
||||
|
width: 80px; |
||||
|
font-size: 14px; |
||||
|
font-family: PingFangSC-Regular, PingFang SC; |
||||
|
font-weight: 400; |
||||
|
color: #0042a3; |
||||
|
line-height: 16px; |
||||
|
cursor: pointer; |
||||
|
transform: translateY(-50%); |
||||
|
|
||||
|
img { |
||||
|
width: 16px; |
||||
|
margin-right: 3px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.item-date { |
||||
|
margin-left: 100px; |
||||
|
font-size: 12px; |
||||
|
font-family: PingFangSC-Regular, PingFang SC; |
||||
|
font-weight: 400; |
||||
|
color: rgba(0, 0, 0, 0.45); |
||||
|
line-height: 17px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.header { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
padding: 12px 0; |
||||
|
margin-bottom: 10px; |
||||
|
border-bottom: 1px solid #f0f5fa; |
||||
|
.title { |
||||
|
height: 22px; |
||||
|
font-size: 16px; |
||||
|
font-family: PingFangSC-Medium, PingFang SC; |
||||
|
font-weight: 500; |
||||
|
color: rgba(0, 0, 0, 0.85); |
||||
|
line-height: 22px; |
||||
|
} |
||||
|
.btn-clear { |
||||
|
font-size: 14px; |
||||
|
font-family: PingFangSC-Regular, PingFang SC; |
||||
|
font-weight: 400; |
||||
|
color: #0042a3; |
||||
|
line-height: 16px; |
||||
|
cursor: pointer; |
||||
|
img { |
||||
|
width: 16px; |
||||
|
margin-right: 3px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
/deep/ .el-tabs__nav-wrap::after { |
||||
|
height: 1px; |
||||
|
background-color: #f0f5fa; |
||||
|
} |
||||
|
|
||||
|
/deep/ .el-pagination__total { |
||||
|
// float: left; |
||||
|
} |
||||
|
</style> |
||||
@ -1,54 +1,61 @@ |
|||||
/** |
/** |
||||
* 配置参考: https://cli.vuejs.org/zh/config/
|
* 配置参考: https://cli.vuejs.org/zh/config/
|
||||
*/ |
*/ |
||||
const IS_PROD = ['production', 'test'].includes(process.env.NODE_ENV) |
const IS_PROD = ["production", "test"].includes(process.env.NODE_ENV); |
||||
module.exports = { |
module.exports = { |
||||
baseUrl: process.env.NODE_ENV === 'production' ? '' : '/epmet-work-pc', |
baseUrl: process.env.NODE_ENV === "production" ? "" : "/epmet-work-pc", |
||||
css: { |
css: { |
||||
// 是否使用css分离插件 ExtractTextPlugin
|
// 是否使用css分离插件 ExtractTextPlugin
|
||||
extract: IS_PROD, |
extract: IS_PROD, |
||||
// 开启 CSS source maps?
|
// 开启 CSS source maps?
|
||||
sourceMap: false, |
sourceMap: false, |
||||
// css预设器配置项
|
// css预设器配置项
|
||||
loaderOptions: {}, |
loaderOptions: {}, |
||||
// 启用 CSS modules for all css / pre-processor files.
|
// 启用 CSS modules for all css / pre-processor files.
|
||||
modules: false |
modules: false, |
||||
}, |
}, |
||||
chainWebpack: (config) => { |
chainWebpack: (config) => { |
||||
const svgRule = config.module.rule('svg') |
const svgRule = config.module.rule("svg"); |
||||
svgRule.uses.clear() |
svgRule.uses.clear(); |
||||
svgRule |
svgRule |
||||
.test(/\.svg$/) |
.test(/\.svg$/) |
||||
.use('svg-sprite-loader') |
.use("svg-sprite-loader") |
||||
.loader('svg-sprite-loader') |
.loader("svg-sprite-loader"); |
||||
}, |
}, |
||||
productionSourceMap: false, |
productionSourceMap: false, |
||||
outputDir: 'epmet-work-pc', |
outputDir: "epmet-work-pc", |
||||
assetsDir: 'static', |
assetsDir: "static", |
||||
devServer: { |
devServer: { |
||||
open: true, |
proxy: { |
||||
port: 9001, |
// 如果请求地址以/api打头,就出触发代理机制
|
||||
overlay: { |
// http://localhost:9588/api/login -> http://localhost:3000/api/login
|
||||
errors: true, |
"/linkdata/linkdata-gateway/route": { |
||||
warnings: true |
target: "http://bipaas.elinkservice.cn", // 我们要代理的真实接口地址
|
||||
} |
}, |
||||
}, |
}, |
||||
// webpack简单配置
|
open: true, |
||||
configureWebpack: { |
port: 9001, |
||||
// debuge调试配置
|
overlay: { |
||||
devtool: 'source-map', |
errors: true, |
||||
externals: { |
warnings: true, |
||||
AMap: 'AMap' |
}, |
||||
}, |
}, |
||||
resolve: { |
// webpack简单配置
|
||||
//配置路径别名
|
configureWebpack: { |
||||
// /node_modules/@vue/cli-service/lib/config/base.js中已经配好的@路径，所以这里可以直接使用@
|
// debuge调试配置
|
||||
alias: { |
devtool: "source-map", |
||||
'@js': '@/js', |
externals: { |
||||
'@c': '@/views/components', |
AMap: "AMap", |
||||
'@v': '@/views', |
}, |
||||
'@m': '@/img' |
resolve: { |
||||
} |
//配置路径别名
|
||||
} |
// /node_modules/@vue/cli-service/lib/config/base.js中已经配好的@路径，所以这里可以直接使用@
|
||||
} |
alias: { |
||||
} |
"@js": "@/js", |
||||
|
"@c": "@/views/components", |
||||
|
"@v": "@/views", |
||||
|
"@m": "@/img", |
||||
|
}, |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
|||||
Loading…
Reference in new issue