13176889840
3 years ago
3 changed files with 516 additions and 2 deletions
@ -0,0 +1,467 @@ |
|||
<template> |
|||
<div class="m-pop"> |
|||
<div class="wrap"> |
|||
<cpt-card> |
|||
<div class="title"> |
|||
<img src="@/assets/img/shuju/title-tip.png" /> |
|||
<span>单位活动</span> |
|||
</div> |
|||
|
|||
<div class="btn-close" @click="handleClose"> |
|||
<img src="@/assets/img/shuju/people/close.png" /> |
|||
</div> |
|||
<!-- <div class="list-title">需求内容</div> --> |
|||
<div class="list-wr info-h"> |
|||
<div class="list-left info-scroll"> |
|||
<div class="left-item left-item-on"> |
|||
<div class="item-title">帮扶老人帮扶老人帮扶老人帮扶老人帮扶老人帮扶老人</div> |
|||
<div class="item-time">2022-05-20 09:09</div> |
|||
</div> |
|||
<div class="left-item"> |
|||
<div class="item-title">帮扶老人帮扶老人</div> |
|||
<div class="item-time">2022-05-20 09:09</div> |
|||
</div> |
|||
</div> |
|||
<div class="list-right list-wr"> |
|||
<div class="list"> |
|||
|
|||
<!-- <div class="item-desc"> |
|||
<span>市北区同德花园小区物业管理服务，公司的同志每天对该小区 公共部位，喷洒消毒液进行消毒。为杀灭新型冠状病毒，近几 天以来，市北区</span> |
|||
</div> --> |
|||
<div class="item"> |
|||
<span class="item-field">服务事项：</span> |
|||
<span>{{ info.serviceMatterNameShow }}</span> |
|||
</div> |
|||
<div class="item"> |
|||
<span class="item-field">单位名称：</span> |
|||
<span>{{ info.unitNameShow }}</span> |
|||
</div> |
|||
<div class="item"> |
|||
<span class="item-field">活动标题：</span> |
|||
<span>{{ info.title }}</span> |
|||
</div> |
|||
<div class="item"> |
|||
<span class="item-field">活动内容：</span> |
|||
<span class="item-content" v-html="info.content"></span> |
|||
</div> |
|||
<div class="item"> |
|||
<span class="item-field">服务人数：</span> |
|||
<span>{{ info.peopleCount }}</span> |
|||
</div> |
|||
<div class="item"> |
|||
<span class="item-field">活动时间：</span> |
|||
<span>{{ info.activityTime }}</span> |
|||
</div> |
|||
<!-- <div class="item"> |
|||
<span class="item-field">活动坐标：</span> |
|||
<span>经度：{{ info.latitude }} <br /> |
|||
纬度：{{ info.longitude }}</span> |
|||
</div> --> |
|||
<div class="item"> |
|||
<span class="item-field">活动地址：</span> |
|||
<span>{{ info.address }}</span> |
|||
</div> |
|||
</div> |
|||
<div class="list"> |
|||
<div class="item"> |
|||
<span class="item-field">活动结果：</span> |
|||
<span class="item-content info-scroll" v-html="info.result"></span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<!-- <div class="tabs"> |
|||
<div |
|||
class="tab-btn" |
|||
> |
|||
<img src="@/assets/img/shuju/people/arrow-double-left.png" /> |
|||
</div> |
|||
<div |
|||
class="tab z-on" |
|||
> |
|||
研判分析 |
|||
</div> |
|||
<div |
|||
class="tab-btn" |
|||
> |
|||
<img src="@/assets/img/shuju/people/arrow-double-right.png" /> |
|||
</div> |
|||
</div> |
|||
|
|||
<div style="padding: 30px 0;"> |
|||
<analyse :single-list="demandList" :single-title="'需求上报'" :more-title="'事件上报'" :user-list="userLists" |
|||
:user-name="userName" :has-event="false" :more-list="eventList" /> |
|||
</div> --> |
|||
|
|||
|
|||
</cpt-card> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import cptCard from "@/views/modules/visual/cpts/card"; |
|||
import analyse from '../cpts/analyse.vue' |
|||
import { requestPost } from "@/js/dai/request"; |
|||
|
|||
export default { |
|||
name: "dialogInfo", |
|||
props: { |
|||
userId: { |
|||
type: String, |
|||
default: "", |
|||
}, |
|||
gridName: { |
|||
type: String, |
|||
default: "", |
|||
}, |
|||
info: Object |
|||
}, |
|||
|
|||
components: { |
|||
cptCard, |
|||
analyse |
|||
}, |
|||
|
|||
data() { |
|||
return { |
|||
fieldList: [], |
|||
groupList: [], |
|||
groupIndex: 0, |
|||
startGroupIndex: 0, |
|||
// info: {}, |
|||
allInfo: {}, |
|||
|
|||
xiaoquList: [], |
|||
louList: [], |
|||
danyuanList: [], |
|||
homeList: [], |
|||
demandList: [ |
|||
{ |
|||
categoryName: '辨明服务', |
|||
categoryCode: '1', |
|||
showItem: false, |
|||
projectList: [ |
|||
{ |
|||
title: '不知道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '1' |
|||
}, |
|||
{ |
|||
title: '罗里吧嗦写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '2' |
|||
}, |
|||
{ |
|||
title: '胡说八道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '1=3' |
|||
}, |
|||
{ |
|||
title: '费眼飞鱼不知道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '1=4' |
|||
}, |
|||
{ |
|||
title: '狗屁不通不知道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '5' |
|||
}, |
|||
{ |
|||
title: '啦啦啦不知道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '6' |
|||
} |
|||
] |
|||
}, |
|||
{ |
|||
categoryName: '辨明服务', |
|||
categoryCode: '1', |
|||
showItem: false, |
|||
projectList: [ |
|||
{ |
|||
title: '不知道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '1' |
|||
}, |
|||
{ |
|||
title: '罗里吧嗦写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '2' |
|||
}, |
|||
{ |
|||
title: '胡说八道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '1=3' |
|||
}, |
|||
{ |
|||
title: '费眼飞鱼不知道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '1=4' |
|||
}, |
|||
{ |
|||
title: '狗屁不通不知道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '5' |
|||
}, |
|||
{ |
|||
title: '啦啦啦不知道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '6' |
|||
} |
|||
] |
|||
}, |
|||
{ |
|||
categoryName: '辨明服务', |
|||
categoryCode: '1', |
|||
showItem: false, |
|||
projectList: [ |
|||
{ |
|||
title: '不知道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '1' |
|||
}, |
|||
{ |
|||
title: '罗里吧嗦写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '2' |
|||
}, |
|||
{ |
|||
title: '胡说八道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '1=3' |
|||
}, |
|||
{ |
|||
title: '费眼飞鱼不知道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '1=4' |
|||
}, |
|||
{ |
|||
title: '狗屁不通不知道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '5' |
|||
}, |
|||
{ |
|||
title: '啦啦啦不知道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '6' |
|||
} |
|||
] |
|||
} |
|||
], |
|||
userLists: [ |
|||
{ |
|||
homeId: '1', |
|||
icUserId: '1', |
|||
icUserName: '沾上干' |
|||
}, |
|||
{ |
|||
homeId: '2', |
|||
icUserId: '2', |
|||
icUserName: '李四' |
|||
}, |
|||
{ |
|||
homeId: '3', |
|||
icUserId: '3', |
|||
icUserName: '王五哈哈' |
|||
} |
|||
], |
|||
userName: '王亚男哈', |
|||
eventList: [ |
|||
{ |
|||
categoryName: '辨明服务', |
|||
categoryCode: '1', |
|||
projectList: [ |
|||
{ |
|||
title: '不知道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '1' |
|||
}, |
|||
{ |
|||
title: '罗里吧嗦写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '2' |
|||
}, |
|||
{ |
|||
title: '胡说八道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '1=3' |
|||
}, |
|||
{ |
|||
title: '费眼飞鱼不知道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '1=4' |
|||
}, |
|||
{ |
|||
title: '狗屁不通不知道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '5' |
|||
}, |
|||
{ |
|||
title: '啦啦啦不知道写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '6' |
|||
} |
|||
] |
|||
}, |
|||
{ |
|||
categoryName: '水煮鱼辨明服务辨明服务', |
|||
categoryCode: '4', |
|||
projectList: [ |
|||
{ |
|||
title: '熟煮雨不知道写了什么哈哈哈', |
|||
status: 'pending', |
|||
projectId: '4' |
|||
} |
|||
] |
|||
}, |
|||
{ |
|||
categoryName: '开心麻花', |
|||
categoryCode: '2', |
|||
projectList: [ |
|||
{ |
|||
title: '不知道开心麻花写了什么哈哈哈', |
|||
status: 'closed', |
|||
projectId: '1' |
|||
} |
|||
] |
|||
}, |
|||
{ |
|||
categoryName: '酸菜鱼', |
|||
categoryCode: '3', |
|||
projectList: [ |
|||
{ |
|||
title: '不知道酸菜鱼写了什么哈哈哈', |
|||
status: 'pending', |
|||
projectId: '3' |
|||
} |
|||
] |
|||
} |
|||
], |
|||
}; |
|||
}, |
|||
|
|||
|
|||
mounted() { |
|||
}, |
|||
|
|||
methods: { |
|||
handleClose() { |
|||
this.$emit("close"); |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" src="@/assets/scss/modules/visual/people.scss" scoped></style> |
|||
<style lang="scss" scoped> |
|||
.m-pop { |
|||
.wrap { |
|||
margin-bottom: 0; |
|||
.list { |
|||
display: block; |
|||
width: 50%; |
|||
.item { |
|||
display: flex; |
|||
width: 100%; |
|||
box-sizing: border-box; |
|||
margin-top: 0; |
|||
margin-bottom: 15px; |
|||
font-size: 16px; |
|||
cursor: pointer; |
|||
.item-field { |
|||
// width: 100px; |
|||
flex-shrink: 0; |
|||
} |
|||
.item-content { |
|||
width: 100%; |
|||
max-height: 420px; |
|||
overflow-y: auto; |
|||
|
|||
} |
|||
::v-deep p { |
|||
margin: 0; |
|||
img { |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
} |
|||
} |
|||
.item-desc { |
|||
font-size: 16px; |
|||
margin-bottom: 10px; |
|||
line-height: 24px; |
|||
} |
|||
} |
|||
} |
|||
.list-title { |
|||
width: 100%; |
|||
box-sizing: border-box; |
|||
padding: 20px 0 10px 62px; |
|||
font-size: 20px; |
|||
cursor: pointer; |
|||
} |
|||
} |
|||
.list-wr { |
|||
display: flex; |
|||
padding: 0 32px; |
|||
|
|||
} |
|||
.list-left { |
|||
width: 180px; |
|||
height: 100%; |
|||
box-sizing: border-box; |
|||
padding-right: 20px; |
|||
flex-shrink: 0; |
|||
border-right: 1px dashed #1257c9; |
|||
overflow: auto; |
|||
.left-item { |
|||
padding: 10px 0; |
|||
cursor: pointer; |
|||
.item-title { |
|||
font-size: 16px; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
white-space: nowrap; |
|||
margin-bottom: 5px; |
|||
} |
|||
} |
|||
.left-item-on { |
|||
color: #0095FF; |
|||
} |
|||
} |
|||
.list-right { |
|||
flex: 1; |
|||
} |
|||
.info-h { |
|||
height: calc(100vh - 320px); |
|||
} |
|||
.info-scroll { |
|||
&::-webkit-scrollbar { |
|||
width: 8px; |
|||
// background: linear-gradient(270deg, #0063FE, #0095FF); |
|||
} |
|||
|
|||
&::-webkit-scrollbar-corner, |
|||
/* 滚动条角落 */ |
|||
&::-webkit-scrollbar-thumb, |
|||
&::-webkit-scrollbar-track { /*滚动条的轨道*/ |
|||
border-radius: 4px; |
|||
} |
|||
|
|||
&::-webkit-scrollbar-corner, |
|||
&::-webkit-scrollbar-track { |
|||
/* 滚动条轨道 */ |
|||
|
|||
background: rgba(12, 129, 254, .24); |
|||
// box-shadow: inset 0 0 1px rgba(180, 160, 120, 0.5); |
|||
} |
|||
|
|||
&::-webkit-scrollbar-thumb { |
|||
/* 滚动条手柄 */ |
|||
background: linear-gradient(270deg, #0063FE, #0095FF); |
|||
} |
|||
} |
|||
|
|||
</style> |
|||
Loading…
Reference in new issue