feat: 消息功能添加
This commit is contained in:
@wpf
parent
5c66853ecf
commit
2dd822a24b
@ -29,6 +29,12 @@
|
||||
this.userInfo = JSON.parse(uni.getStorageSync('userInfo'))
|
||||
if (this.userInfo.accountType == 5 || this.userInfo.accountType == 6 || this.userInfo.accountType == 10) {
|
||||
this.tabList.push({
|
||||
appName: '消息',
|
||||
moduleIcon2: 'tabIcon-index',
|
||||
moduleIcon: 'tabIcon-index-active',
|
||||
plugin: 'messageTask',
|
||||
appShow: 1
|
||||
},{
|
||||
appName: '首页',
|
||||
moduleIcon2: 'tabIcon-index',
|
||||
moduleIcon: 'tabIcon-index-active',
|
||||
@ -173,6 +179,11 @@
|
||||
url: '../../pages/markRoomManage/markRoomManage'
|
||||
})
|
||||
break;
|
||||
case 'messageTask':
|
||||
uni.redirectTo({
|
||||
url: '/pages/messageTask/messageTask'
|
||||
})
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
2
node_modules/.package-lock.json
generated
vendored
2
node_modules/.package-lock.json
generated
vendored
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "zhgdyunapp",
|
||||
"lockfileVersion": 2,
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"node_modules/@babel/runtime": {
|
||||
|
||||
22
pages.json
22
pages.json
@ -1597,6 +1597,28 @@
|
||||
}
|
||||
|
||||
}
|
||||
,{
|
||||
"path": "pages/messageTask/messageTask",
|
||||
"style": {}
|
||||
}
|
||||
,{
|
||||
"path" : "pages/messageTask/messageList",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText": "",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
|
||||
}
|
||||
,{
|
||||
"path" : "pages/messageTask/messageDetail",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText": "",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
|
||||
}
|
||||
],
|
||||
// "subPackages":[{
|
||||
// "root": "carManage",
|
||||
|
||||
64
pages/messageTask/messageDetail.vue
Normal file
64
pages/messageTask/messageDetail.vue
Normal file
@ -0,0 +1,64 @@
|
||||
<template>
|
||||
<view class="">
|
||||
<headers :showBack="true">
|
||||
<view class="headerName">
|
||||
查看详情
|
||||
</view>
|
||||
</headers>
|
||||
<view class="main">
|
||||
<view class="head">
|
||||
【#梅大高速塌方货车司机夫妇喊停后车#：车身长掉头时堵路摆手拦住后车】
|
||||
</view>
|
||||
<view class="hint">
|
||||
#梅大高速塌方货车司机大车堵路喊停来车#据广东梅州大埔县委宣传部通报，截至5月1日15时，事故造成20辆车陷落，涉及54人，其中24人死亡，30人正在医院全力救治。1日2时许，在梅大高速驶向泉州的冷藏车司机王先生和妻子发现异常。王先生回忆，当时他们距离塌方路段约100多米，看到几辆小车逆行驶来，“我赶紧降速打双闪，有个大姐说前面道路塌陷起火了。我尝试掉头，冷藏车车身较长把路堵住了，后车都纷纷减速了，后来我把车回正，和妻子下车摆手示意让后车停车。”
|
||||
</view>
|
||||
<image class="picture" src="../../static/titleBg.png" mode=""></image>
|
||||
<view class="time">
|
||||
2023-12-12 02:00:00
|
||||
</view>
|
||||
</view>
|
||||
<view class="btn">
|
||||
处置违规
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.main{
|
||||
padding: 12px;
|
||||
padding-bottom: 50px;
|
||||
.head{
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.hint{
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.picture{
|
||||
width: 100%;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.time{
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
.btn{
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 48px;
|
||||
background-color: #1E90FF;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
text-align: center;
|
||||
line-height: 48px;
|
||||
}
|
||||
</style>
|
||||
166
pages/messageTask/messageList.vue
Normal file
166
pages/messageTask/messageList.vue
Normal file
@ -0,0 +1,166 @@
|
||||
<template>
|
||||
<view class="">
|
||||
<headers :showBack="true">
|
||||
<view class="headerName">
|
||||
{{headersName}}
|
||||
</view>
|
||||
</headers>
|
||||
<!--选项 -->
|
||||
<view class="item">
|
||||
<view class="itemInner" :class="tabIndex==0?'active':''" @click="tabIndex=0">
|
||||
<view class="">
|
||||
未读
|
||||
</view>
|
||||
</view>
|
||||
<view class="itemInner" :class="tabIndex==1?'active':''" @click="tabIndex=1">
|
||||
<view class="">
|
||||
全部
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!--列表 -->
|
||||
<view class="list" v-if="tabIndex==0">
|
||||
<view class="list-item" v-for="item in 12" @click="toDetail">
|
||||
<view class="content">
|
||||
<view class="head">
|
||||
您有一条【安全隐患大项待整改】您有一条【安全隐患大项待整改】
|
||||
</view>
|
||||
<view class="hint">
|
||||
点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="box">
|
||||
<view class="left">
|
||||
发生时间：2023-12-12
|
||||
</view>
|
||||
<view class="right">
|
||||
查看更多
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list" v-if="tabIndex==1">
|
||||
<view class="list-item" v-for="item in 5" @click="toDetail">
|
||||
<view class="content">
|
||||
<view class="head">
|
||||
您有一条【安全隐患大项待整改】您有一条【安全隐患大项待整改】
|
||||
</view>
|
||||
<view class="hint">
|
||||
点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="box">
|
||||
<view class="left">
|
||||
发生时间：2023-12-12
|
||||
</view>
|
||||
<view class="right">
|
||||
查看更多
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import headers from "@/components/headers/headers.vue"
|
||||
export default {
|
||||
components: {
|
||||
headers
|
||||
},
|
||||
data() {
|
||||
return{
|
||||
headersName:'',
|
||||
tabIndex:0
|
||||
}
|
||||
},
|
||||
onLoad(e){
|
||||
console.log(e.name)
|
||||
this.headersName = e.name
|
||||
},
|
||||
methods: {
|
||||
toDetail(){
|
||||
uni.navigateTo({
|
||||
url: './messageDetail'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.item {
|
||||
display: flex;
|
||||
box-shadow: 0px 0px 8px -3px rgba(0, 0, 0, 0.4);
|
||||
margin-bottom: 20px;
|
||||
.itemInner {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 15px 0;
|
||||
}
|
||||
.active {
|
||||
color: #1E90FF;
|
||||
font-weight: bold;
|
||||
border-bottom: 1px solid #1E90FF;
|
||||
}
|
||||
}
|
||||
.list{
|
||||
padding-bottom: 30px;
|
||||
.list-item{
|
||||
height: 92px;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: column;
|
||||
margin: 6px 12px;
|
||||
padding: 6px 12px;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0px 0px 8px -3px rgba(0, 0, 0, 0.4);
|
||||
.content{
|
||||
.head{
|
||||
font-size: 14px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
.hint{
|
||||
font-size: 10px;
|
||||
color: #666;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
}
|
||||
.box{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.left{
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
font-size: 10px;
|
||||
color: #666;
|
||||
}
|
||||
.right{
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
height: 20px;
|
||||
padding: 0 6px;
|
||||
background: linear-gradient(to right, #c3c3c3, #fff);
|
||||
border-radius: 12px;
|
||||
color: #DA70D6;
|
||||
box-sizing: border-box;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
133
pages/messageTask/messageTask.vue
Normal file
133
pages/messageTask/messageTask.vue
Normal file
@ -0,0 +1,133 @@
|
||||
<template>
|
||||
<view>
|
||||
<headers :showBack="false" :themeType="'white'">
|
||||
<view class="headerName">
|
||||
消息
|
||||
</view>
|
||||
</headers>
|
||||
<view class="operateBar" @click="toList('通知公告')">
|
||||
<view class="left">
|
||||
<view class="box">
|
||||
<view class="num">
|
||||
26
|
||||
</view>
|
||||
<image class="operateIcon" src="@/static/file.png" mode="widthFix"></image>
|
||||
</view>
|
||||
通知公告
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="time">
|
||||
2023-3-21
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="operateBar" @click="toList('任务代办')">
|
||||
<view class="left">
|
||||
<view class="box">
|
||||
<view class="num">
|
||||
26
|
||||
</view>
|
||||
<image class="operateIcon" src="@/static/file.png" mode="widthFix"></image>
|
||||
</view>
|
||||
任务代办
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="time">
|
||||
2023-3-21
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="operateBar" @click="toList('风险预警')">
|
||||
<view class="left">
|
||||
<view class="box">
|
||||
<view class="num">
|
||||
26
|
||||
</view>
|
||||
<image class="operateIcon" src="@/static/file.png" mode="widthFix"></image>
|
||||
</view>
|
||||
风险预警
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="time">
|
||||
2023-3-21
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<footers :activeTab="'messageTask'"></footers>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import footers from "../../components/footers/footers.vue"
|
||||
import headers from "@/components/headers/headers.vue"
|
||||
|
||||
export default {
|
||||
components: {
|
||||
footers,
|
||||
headers
|
||||
},
|
||||
data() {
|
||||
return{
|
||||
accountType: 1,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
toList(name){
|
||||
//带头部名称跳转
|
||||
uni.navigateTo({
|
||||
url: './messageList?name='+name
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.operateBar {
|
||||
background-color: #FFFFFF;
|
||||
font-size: 14px;
|
||||
height: 58px;
|
||||
display: flex;
|
||||
margin: 0 15px;
|
||||
padding: 12px 0;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid #f3f3f3;
|
||||
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.box{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
margin-right: 10px;
|
||||
.num{
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
font-size: 8px;
|
||||
padding: 0 4px;
|
||||
background-color: red;
|
||||
color: #fff;
|
||||
border-radius: 12px;
|
||||
}
|
||||
.operateIcon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.right{
|
||||
display: flex;
|
||||
.time{
|
||||
font-size: 12px;
|
||||
color: #c3c3c3;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user