hldy_xcx/pages/oldmanindex/message.vue

491 lines
9.4 KiB
Vue
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="container">
<!-- <view class="title-back">
<view class="left-father" @click="goBack">
<image class="back-img" src="https://www.focusnu.com/media/directive/index/left.png" />
</view>
</view> -->
<view class="title-back" :style="{height:`${uni.getStorageSync('moveHeight')+40}px`}">
<view class="left-father" @click="goBack">
<image class="back-img" src="https://www.focusnu.com/media/directive/index/left.png" />
<!-- <view style="font-size: 30rpx;">机构加盟</view> -->
</view>
</view>
<view :style="{height:`${uni.getStorageSync('moveHeight') + 30}px`}"></view>
<view class="title-father" v-if="hulijigouArray.length">
<view class="title-shu"></view>
<view class="title-font">
<view class="title-dian" v-if="hong">
<!-- {{ hong }} -->
</view>
消息
</view>
</view>
<view
style="width: 100%;margin-top: 170rpx;display: flex;flex-direction: column;justify-content: center;align-items: center;"
v-if="!hulijigouArray.length">
<image style="height: 350rpx;width: 350rpx;"
src="https://www.focusnu.com/media/directive/index/nomessage.png" />
<view style="color: #8E96AD;margin-top: -40rpx;">
暂无消息
</view>
</view>
<view style="width: 100%;display: flex;flex-wrap: wrap;">
<view v-for="(item,index) in hulijigouArray" :key="index" class="zhiling-box-card"
style="margin-top: 30rpx;position: relative;width: 92%;flex-direction: column;"
@click="clickCard(item)">
<view style="height: 10rpx;"></view>
<view class="card-title">
<image style="height: 70rpx;width: 70rpx;margin-left: 30rpx;"
src="https://www.focusnu.com/media/directive/index/messagetype/0.png" />
<view class="card-title-font">
{{ item.title }}
</view>
<view class="card-right">
{{ item.createTime.substring(item.createTime.indexOf("-") + 1, item.createTime.indexOf("-") + 6) }}
<view class="card-dian" v-if="item.izRead==`N`"></view>
</view>
</view>
<view class="gray-heng">
</view>
<view class="card-bottom">
{{ item.content }}
</view>
</view>
</view>
<!-- 处理margin重叠 -->
<view style="height: 200rpx;">
</view>
</view>
</template>
<script setup lang="ts">
import {
reactive,
ref,
onMounted,
onUnmounted
} from 'vue';
import { getInvited, invitedConfirm, getNotice, upRead, isRead } from './api.js'
import {onLoad, onShow,onUnload } from '@dcloudio/uni-app'
onUnload(()=>{
prevPages()
})
const prevPages=()=>{
const pages = getCurrentPages()
const prevPage = pages[pages.length - 2]
if (prevPage) {
prevPage.onShow()
}
}
// onUnload(()=>{
// })
const hulijigouArray = ref([])
const popupshow = ref(false);
const supervalue = ref("");
const clickCard = (type : string) => {
// console.log("???",type.id)
if (type.izRead == "N") {
upRead({ id: type.id }).then(res => {
if (res.success) {
search()
switch (type.type) {
case "emp_org_invited_emp_list":
uni.navigateTo({
url: `/pages/yuangongindex/simpleyaoqing?extend=${type.extend}`
})
break
}
}
})
} else {
// checkRed()
switch (type.type) {
case "emp_org_invited_emp_list":
uni.navigateTo({
url: `/pages/yuangongindex/simpleyaoqing?extend=${type.extend}`
})
break
}
}
}
const checkRed = () => {
prevPages();
if (hulijigouArray.value.every(item => item.izRead == `Y`)) {
hong.value = false;
} else {
hong.value = true;
}
}
const goBack = () => {
// uni.navigateBack();
uni.reLaunch({
url: '/pages/oldmanindex/index'
})
}
const search = () => {
getNotice().then((res : any) => {
// hulijigouArray.value = res.result
if (res.success) {
hulijigouArray.value = res.result
checkRed()
}
})
}
const sumbit = ref(false);
const changeStatus = (item, status) => {
let data = {
employeeId: item.employeesId,
status: status ? 2 : 3,
orgCode: item.orgCode
}
invitedConfirm(data).then(res => {
if (res.success) {
search()
}
})
}
const hong = ref(false)
onShow(() => {
search()
// isRead().then(res =>{
// console.log("????",res.result)
// if (res.result) {
// hong.value = true;
// }
// })
})
</script>
<style lang="scss" scoped>
.container {
display: flex;
flex-direction: column;
min-height: 100vh;
width: 100%;
background-color: #F7F7F7;
position: relative;
}
.title-back {
background-color: #F7F7F7;
width: 100%;
height: 70rpx;
display: flex;
justify-content: space-between;
align-items: flex-end;
padding-bottom: 20rpx;
border-bottom: 1rpx solid #cbd1d2;
position: fixed;
top: 0;
left: 0;
z-index: 9999;
}
.left-father {
display: flex;
align-items: center;
.back-img {
width: 45rpx;
height: 40rpx;
margin-left: 40rpx;
margin-right: 15rpx;
}
}
.zhiling-box {
display: flex;
justify-content: space-around;
align-items: center;
width: 92%;
margin-left: 4%;
height: 110rpx;
background-color: #fff;
border-radius: 35rpx;
font-size: 32rpx;
border: 4rpx solid #fff;
}
.input-all {
width: 500rpx;
height: 65rpx;
border-radius: 30rpx;
background-color: #F7F7F7;
padding-left: 80rpx;
margin-left: 30rpx;
display: flex;
align-items: center;
position: relative;
}
.popop-father {
width: 100%;
height: 600rpx;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.popop-font {
margin-top: 40rpx;
width: 70%;
text-align: center;
line-height: 40rpx;
font-size: 30rpx;
margin-bottom: 100rpx;
}
.popop-blue {
display: flex;
justify-content: center;
align-items: center;
width: 80%;
display: flex;
justify-content: center;
align-items: center;
height: 90rpx;
border-radius: 35rpx;
background: linear-gradient(to bottom, #e7f4ff, #c5e5ff);
border: 2rpx solid #9AD1FF;
color: #007CFF;
font-size: 33rpx;
margin-bottom: 30rpx;
}
.button-father {
position: fixed;
bottom: 0rpx;
left: 0;
width: 100%;
display: flex;
justify-content: center;
background-color: #fff;
}
.blue-button {
display: flex;
justify-content: center;
align-items: center;
width: 30%;
height: 60rpx;
margin: 0 30rpx;
// margin: 0rpx auto;
// margin-bottom: 80rpx;
// margin-top: 20rpx;
margin-top: 10rpx;
background: linear-gradient(to bottom, #e7f4ff, #c5e5ff);
border: 2rpx solid #9AD1FF;
color: #007CFF;
border-radius: 25rpx;
font-size: 30rpx;
}
.white-button {
display: flex;
justify-content: center;
align-items: center;
width: 30%;
height: 60rpx;
margin: 0 30rpx;
margin-top: 10rpx;
// color: #fff;
background: linear-gradient(to bottom, #f3f3f5, #dee4e9);
border-radius: 25rpx;
font-size: 30rpx;
}
.zhiling-box-card {
display: flex;
width: 92%;
margin-left: 4%;
// height: 190rpx;
background-color: #fff;
border-radius: 35rpx;
font-size: 32rpx;
border: 4rpx solid #fff;
overflow: hidden;
}
.applying {
position: absolute;
right: 20rpx;
top: 0rpx;
background-color: #FFE8D3;
color: #FF7900;
width: 130rpx;
height: 50rpx;
display: flex;
justify-content: center;
align-items: center;
font-size: 28rpx;
border-radius: 10rpx;
margin-left: 35rpx;
margin-top: 25rpx;
// margin-top: 20rpx;
// margin-bottom: 20rpx;
}
.applysuccess {
position: absolute;
right: 20rpx;
top: 0rpx;
background-color: #DEF1FF;
color: #0093FF;
width: 130rpx;
height: 50rpx;
display: flex;
justify-content: center;
align-items: center;
font-size: 28rpx;
border-radius: 10rpx;
margin-left: 35rpx;
margin-top: 25rpx;
// margin-bottom: 20rpx;
}
.applyfail {
position: absolute;
right: 20rpx;
top: 0rpx;
background-color: #fff4f7;
color: #FC3D7F;
width: 130rpx;
height: 50rpx;
display: flex;
justify-content: center;
align-items: center;
font-size: 28rpx;
border-radius: 10rpx;
margin-left: 35rpx;
margin-top: 20rpx;
// margin-bottom: 20rpx;
}
.card-font {
margin-left: 40rpx;
font-size: 32rpx;
margin-top: 30rpx;
word-wrap: break-word;
width: 450rpx;
font-weight: 600;
}
.gray-font {
margin-left: 40rpx;
font-size: 31rpx;
margin-top: 30rpx;
color: #B1B1B1;
width: 100%;
}
.title-father {
display: flex;
margin-top: 50rpx;
margin-left: 50rpx;
align-items: center;
.title-shu {
width: 15rpx;
height: 35rpx;
border-radius: 10rpx;
background: linear-gradient(to top, #00BBFF, #0062C3);
}
.title-font {
font-size: 40rpx;
font-weight: 600;
margin-left: 30rpx;
position: relative;
.title-dian {
position: absolute;
right: -10rpx;
top: 0rpx;
width: 20rpx;
height: 20rpx;
border-radius: 50%;
background-color: #FF5757;
color: #fff;
font-size: 25rpx;
}
}
}
.gray-heng {
width: 90%;
margin-left: 5%;
background-color: #f3f3f3;
height: 1rpx;
}
.card-title {
width: 100%;
height: 100rpx;
display: flex;
align-items: center;
position: relative;
.card-title-font {
font-size: 32rpx;
margin-left: 20rpx;
width: 430rpx;
}
.card-right {
position: absolute;
right: 10rpx;
top: 50%;
transform: translateY(-50%);
width: 140rpx;
display: flex;
color: #999999;
}
.card-dian {
width: 20rpx;
height: 20rpx;
border-radius: 50%;
background-color: #FF5757;
margin: auto 0;
margin-left: 15rpx;
}
}
.card-bottom {
width: calc(100% - 80rpx);
margin: 40rpx;
overflow-wrap: break-word;
color: #666666;
}
</style>