731 lines
27 KiB
Vue
731 lines
27 KiB
Vue
<!-- 应急事件 -->
|
||
<template>
|
||
<view class="main">
|
||
<view class="event-list pad15">
|
||
<!-- 充电桩设备故障 -->
|
||
<view :class="item.status === 1 ? 'event-item left-ok' : item.status === 2 ? 'event-item' : ''"
|
||
v-for="(item, index) in showList" :key="index" @click="handleShowDetail(item)">
|
||
<view class="event-header">
|
||
<view class="event-title">{{ type === 1 ? item.title || "" : type === 2 ? item.service || "" : "" }}
|
||
</view>
|
||
<view class="event-meta">
|
||
<view class="event-time">
|
||
<text>🕐</text><text>{{ item.time || "" }}</text>
|
||
</view>
|
||
<view class="event-priority priority-high" :style="{
|
||
background: item.status === 1 ? '#E7F8EE' : item.status === 2 ? '#f9dfe2' : '',
|
||
color: item.status === 1 ? '#3DC272' : item.status === 2 ? '#ff4757' : ''
|
||
}">
|
||
{{ item.status === 1 ? '已完成' : item.status ===
|
||
2 ? '处理中' : '' }}</view>
|
||
</view>
|
||
</view>
|
||
<view class="event-content">
|
||
<view class="event-description">
|
||
<text class="line">{{ item.desc || "" }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 顾客投诉 -->
|
||
<view class="event-item" v-if="false">
|
||
<view class="event-header">
|
||
<view class="event-title">😠 顾客投诉：餐厅服务问题</view>
|
||
<view class="event-meta">
|
||
<view class="event-time">
|
||
<text>🕐</text><text>13:45</text>
|
||
</view>
|
||
<view class="event-priority priority-high">高优先级</view>
|
||
</view>
|
||
</view>
|
||
<view class="event-content">
|
||
<view class="event-description">
|
||
<text class="line">顾客反馈餐厅用餐区卫生状况不佳，桌面未及时清理，垃圾桶满溢。</text>
|
||
<text class="line">要求立即整改并给出解决方案。</text>
|
||
</view>
|
||
<view class="event-actions">
|
||
<button class="event-action-btn btn-primary" @click="contactStaff('cleaning')">通知保洁</button>
|
||
<button class="event-action-btn btn-warning"
|
||
@click="updateEventStatus('complaint', 'processing')">处理中</button>
|
||
<button class="event-action-btn btn-success" @click="resolveEvent('complaint')">标记解决</button>
|
||
</view>
|
||
<view class="event-status">
|
||
<view class="status-dot status-processing"></view>
|
||
<text>状态：处理中 | 负责人：陈大哥</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 安全隐患 -->
|
||
<view class="event-item warning" v-if="false">
|
||
<view class="event-header">
|
||
<view class="event-title">⚠️ 停车场照明不足</view>
|
||
<view class="event-meta">
|
||
<view class="event-time">
|
||
<text>🕐</text><text>12:30</text>
|
||
</view>
|
||
<view class="event-priority priority-medium">中优先级</view>
|
||
</view>
|
||
</view>
|
||
<view class="event-content">
|
||
<view class="event-description">
|
||
<text class="line">B区停车场2盏路灯损坏，夜间照明不足，存在安全隐患。</text>
|
||
<text class="line">建议在晚班前修复，确保顾客夜间停车安全。</text>
|
||
</view>
|
||
<view class="event-actions">
|
||
<button class="event-action-btn btn-primary"
|
||
@click="contactMaintenance('lighting')">联系电工</button>
|
||
<button class="event-action-btn btn-warning" @click="scheduleRepair('lighting')">排期维修</button>
|
||
<button class="event-action-btn btn-success" @click="resolveEvent('lighting')">标记解决</button>
|
||
</view>
|
||
<view class="event-status">
|
||
<view class="status-dot status-pending"></view>
|
||
<text>状态：待处理 | 负责人：刘师傅</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 已解决事件 -->
|
||
<view class="event-item resolved" v-if="false">
|
||
<view class="event-header">
|
||
<view class="event-title">✅ 洗手间堵塞问题</view>
|
||
<view class="event-meta">
|
||
<view class="event-time">
|
||
<text>🕐</text><text>11:15</text>
|
||
</view>
|
||
<view class="event-priority priority-low">已解决</view>
|
||
</view>
|
||
</view>
|
||
<view class="event-content">
|
||
<view class="event-description">
|
||
<text class="line">男洗手间第3间堵塞，已联系保洁人员处理完毕，设施恢复正常使用。</text>
|
||
</view>
|
||
<view class="event-status">
|
||
<view class="status-dot status-resolved"></view>
|
||
<text>状态：已解决 | 解决时间：11:45 | 处理人：陈大哥</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 应急事件详情 -->
|
||
<uni-popup ref="popup" border-radius="10px 10px 0 0" @change="handlePopupChange">
|
||
<!-- 应急事件的 -->
|
||
<view class="eventsPopupBox" v-if="eventsDetail && type === 1">
|
||
<view class="eventsItemTitle">应急事件</view>
|
||
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">标题：</view>
|
||
<view class="eventsValue">{{ eventsDetail.title || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">事件片区：</view>
|
||
<view class="eventsValue">{{ eventsDetail.area || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">事件服务区：</view>
|
||
<view class="eventsValue">{{ eventsDetail.service || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">联系人：</view>
|
||
<view class="eventsValue">{{ eventsDetail.person || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">联系电话：</view>
|
||
<view class="eventsValue">{{ eventsDetail.phone || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">处理用时：</view>
|
||
<view class="eventsValue">{{ eventsDetail.haveTime || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">死亡人数：</view>
|
||
<view class="eventsValue">{{ eventsDetail.diePerson || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">事件概况：</view>
|
||
<view class="eventsValue">{{ eventsDetail.desc || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">事件损失情况：</view>
|
||
<view class="eventsValue">{{ eventsDetail.lossDesc || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">处理结果：</view>
|
||
<view class="eventsValue">{{ eventsDetail.res || "" }}</view>
|
||
</view>
|
||
<view class="eventsItemPic">
|
||
<view class="eventsLabel">事件现场照片：</view>
|
||
<view class="eventsPic" v-if="eventsDetail.imgList && eventsDetail.imgList.length > 0">
|
||
<view class="eventsPicItem" v-for="(item, index) in eventsDetail.imgList" :key="index"
|
||
@click="showImg(eventsDetail.imgList, index)">
|
||
<image class="eventsPicImg" :src="item.url" />
|
||
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 日常问题 -->
|
||
<view class="eventsPopupBox" v-if="eventsDetail && type === 2">
|
||
<view class="eventsItemTitle">应急事件</view>
|
||
<!-- <view class="eventsItem">
|
||
<view class="eventsLabel">处理状态：</view>
|
||
<view class="eventsValue"></view>
|
||
</view> -->
|
||
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">事件片区：</view>
|
||
<view class="eventsValue">{{ eventsDetail.area || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">事件服务区：</view>
|
||
<view class="eventsValue">{{ eventsDetail.service || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">类型：</view>
|
||
<view class="eventsValue">{{ eventsDetail.type || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">问题描述：</view>
|
||
<view class="eventsValue">{{ eventsDetail.desc || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">联系人：</view>
|
||
<view class="eventsValue">{{ eventsDetail.person || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">联系电话：</view>
|
||
<view class="eventsValue">{{ eventsDetail.phone || "" }}</view>
|
||
</view>
|
||
|
||
<view class="eventsSmallTitle">协调处理情况</view>
|
||
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">协调处理结果：</view>
|
||
<view class="eventsValue">{{ eventsDetail.startRes || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">办理人：</view>
|
||
<view class="eventsValue">{{ eventsDetail.startPerson || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">办理完成时间：</view>
|
||
<view class="eventsValue">{{ eventsDetail.startTime || "" }}</view>
|
||
</view>
|
||
|
||
<view class="eventsSmallTitle">经营公司协调处理情况</view>
|
||
|
||
<view class="eventsItemPic">
|
||
<view class="eventsLabel">协调处理结果：</view>
|
||
<view class="eventsPic">{{ eventsDetail.endRes || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">办理人：</view>
|
||
<view class="eventsValue">{{ eventsDetail.endPerson || "" }}</view>
|
||
</view>
|
||
<view class="eventsItem">
|
||
<view class="eventsLabel">办理完成时间：</view>
|
||
<view class="eventsValue">{{ eventsDetail.endTime || "" }}</view>
|
||
</view>
|
||
<view class="eventsItemPic">
|
||
<view class="eventsLabel">事件现场照片：</view>
|
||
<view class="eventsPic" v-if="eventsDetail.imgList && eventsDetail.imgList.length > 0">
|
||
<view class="eventsPicItem" v-for="(item, index) in eventsDetail.imgList" :key="index"
|
||
@click="showImg(eventsDetail.imgList, index)">
|
||
<image class="eventsPicImg" :src="item.url" />
|
||
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
dataList: [
|
||
{
|
||
title: "中和停车区下行停水",
|
||
time: "2023-09-26 13:30:38",
|
||
area: "昭通片区管理补",// 片区
|
||
service: "中和加油站-上行",// 事件服务区
|
||
eventType: "事件类型1",// 事件类型
|
||
person: "徐琴",// 联系人
|
||
phone: "13408871099",//联系电话
|
||
theInjured: "",// 受伤人数
|
||
haveTime: "待定",// 处理用时
|
||
diePerson: "0",//死亡人数
|
||
desc: "水泵房故障，导致停水，急需处理",//事件现场概况
|
||
lossDesc: "因突发情况 卫生间卫生无法保障",// 事件损失情况
|
||
res: "已联系施工方，未处理",//处理结果
|
||
imgList: [{ url: "https://eshangtech.com/cyy_DIB/1695785143848.jpg" }],// 事件现场照片
|
||
status: 1,
|
||
},
|
||
{
|
||
title: "楼坝服务区停水",
|
||
time: "2023-08-02 13:57:27",
|
||
area: "昭通片区管理补",// 片区
|
||
service: "楼坝服务区-下行",// 事件服务区
|
||
eventType: "事件类型1",// 事件类型
|
||
person: "孔令婷",// 联系人
|
||
phone: "19987196597",//联系电话
|
||
theInjured: "",// 受伤人数
|
||
haveTime: "7小时",// 处理用时
|
||
diePerson: "0",//死亡人数
|
||
desc: "楼坝街道主水管道被路面改造施工的挖机挖断，目前正在抢修中，预计7小时后可正常供水，服务区现用水箱里的储水进行供水。",//事件现场概况
|
||
lossDesc: "无",// 事件损失情况
|
||
res: "正在进行抢修，预计7小时后可正常供水，服务区现用水箱里的储水进行供水。",//处理结果
|
||
imgList: null,// 事件现场照片
|
||
status: 2,
|
||
} // status 1 已完成 2 处理中
|
||
],
|
||
everyDayList: [
|
||
{
|
||
area: "版纳片区管理部", // 事件片区：
|
||
service: "小勐养服务区-上行", // 事件服务区：
|
||
time: "2024-09-12 09:14:47",
|
||
type: "其他", // 类型：
|
||
desc: "小勐养服务区上行卫生间5号蹲坑隔板底座损坏，已修复。",// 问题描述：
|
||
person: "杨杰",// 联系人：
|
||
phone: "13628710377",// 联系电话：
|
||
startRes: "修复完毕，建议结束流程",// 协调处理结果：
|
||
startPerson: "刀天华",// 办理人：
|
||
startTime: "2024-09-12 09:43:53",// 办理完成时间：
|
||
endRes: "",// 协调处理结果：
|
||
endPerson: "",// 办理人：
|
||
endTime: "流转后自动显示",// 办理完成时间：
|
||
imgList: [
|
||
{ url: "https://eshangtech.com/cyy_DIB/1726104387683_mmexport1726104287279.jpg" },
|
||
{ url: "https://eshangtech.com/cyy_DIB/1726104504808_IMG_20240912_091809.jpg" }
|
||
],// 事件现场照片
|
||
status: 1,
|
||
},
|
||
{
|
||
area: "昆东片区管理部", // 事件片区：
|
||
service: "阳宗服务区-上行", // 事件服务区：
|
||
time: "2024-08-08 13:45:25",
|
||
type: "维修上报", // 类型：
|
||
desc: "关于昆东片区管理部阳宗服务区上行更换入口车辆引导标识牌的请示",// 问题描述：
|
||
person: "唐林波",// 联系人：
|
||
phone: "15287959258",// 联系电话：
|
||
startRes: "按照公司相关流程进行更换标识牌审批事宜",// 协调处理结果：
|
||
startPerson: "申锐娟",// 办理人：
|
||
startTime: "流转后自动显示",// 办理完成时间：
|
||
endRes: "",// 协调处理结果：
|
||
endPerson: "",// 办理人：
|
||
endTime: "流转后自动显示",// 办理完成时间：
|
||
imgList: null,// 事件现场照片
|
||
status: 2,
|
||
}
|
||
],
|
||
showList: [],
|
||
eventsDetail: null,
|
||
type: 0
|
||
}
|
||
},
|
||
onLoad(query) {
|
||
if (query.type) {
|
||
this.type = Number(query.type)
|
||
if (this.type === 1) {
|
||
this.showList = this.dataList
|
||
} else {
|
||
this.showList = this.everyDayList
|
||
uni.setNavigationBarTitle({
|
||
title: '日常问题'
|
||
})
|
||
}
|
||
}
|
||
},
|
||
methods: {
|
||
handleShowDetail(obj) {
|
||
this.$refs.popup.open('center')
|
||
this.eventsDetail = obj
|
||
},
|
||
handlePopupChange(e) {
|
||
this.showPopup = e.show
|
||
console.log('e', e);
|
||
if (!e.show) {
|
||
this.userDetail = null
|
||
}
|
||
},
|
||
// 图片预览
|
||
showImg(list, index) {
|
||
console.log('list', list);
|
||
console.log('indexindex', index);
|
||
let urls = []
|
||
list.forEach((item) => {
|
||
urls.push(item.url)
|
||
})
|
||
|
||
uni.previewImage({
|
||
urls: urls,
|
||
current: list[index].url,
|
||
});
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
<style lang="less" scoped>
|
||
@bg: #f8f9fa;
|
||
@muted: #666;
|
||
@card: #fff;
|
||
@shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||
@primary: #27B25F;
|
||
@primary2: #4CCC7F;
|
||
@ok: #2ed573;
|
||
@warn: #ff9f43;
|
||
@danger: #ff4757;
|
||
|
||
/* 抽屉页（特情/设施） */
|
||
.main {
|
||
width: 100vw;
|
||
height: 100vh;
|
||
|
||
.emergency-details-header {
|
||
background: linear-gradient(135deg, @danger, #ff3838);
|
||
color: #fff;
|
||
padding: 40rpx;
|
||
position: relative;
|
||
box-shadow: @shadow;
|
||
|
||
&.facilities-theme {
|
||
background: linear-gradient(135deg, #20bf6b, #0fb9b1);
|
||
}
|
||
|
||
.emergency-back-btn {
|
||
position: absolute;
|
||
left: 30rpx;
|
||
top: 30rpx;
|
||
background: rgba(255, 255, 255, .2);
|
||
border: none;
|
||
color: #fff;
|
||
font-size: 36rpx;
|
||
width: 80rpx;
|
||
height: 80rpx;
|
||
border-radius: 50%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
|
||
.h1 {
|
||
text-align: center;
|
||
display: block;
|
||
margin-bottom: 6rpx;
|
||
}
|
||
|
||
.current-area {
|
||
text-align: center;
|
||
display: block;
|
||
opacity: .9;
|
||
}
|
||
}
|
||
|
||
.event-list {
|
||
padding: 30rpx;
|
||
|
||
.event-item {
|
||
background: #fff;
|
||
border-radius: 24rpx;
|
||
margin-bottom: 30rpx;
|
||
overflow: hidden;
|
||
box-shadow: @shadow;
|
||
border-left: 8rpx solid @danger;
|
||
|
||
&.warning {
|
||
border-left-color: @warn;
|
||
}
|
||
|
||
&.resolved {
|
||
border-left-color: @ok;
|
||
opacity: .85;
|
||
}
|
||
|
||
&.left-ok {
|
||
border-left-color: @ok;
|
||
}
|
||
|
||
&.left-warn {
|
||
border-left-color: @warn;
|
||
}
|
||
|
||
.event-header {
|
||
padding: 30rpx;
|
||
border-bottom: 1rpx solid #f1f3f4;
|
||
background: #fff;
|
||
|
||
.event-title {
|
||
font-weight: 700;
|
||
font-size: 32rpx;
|
||
margin-bottom: 10rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 16rpx;
|
||
}
|
||
|
||
.event-meta {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
font-size: 24rpx;
|
||
color: @muted;
|
||
|
||
.event-time {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8rpx;
|
||
}
|
||
|
||
.event-priority {
|
||
padding: 6rpx 16rpx;
|
||
border-radius: 20rpx;
|
||
font-size: 22rpx;
|
||
font-weight: 700;
|
||
|
||
&.priority-high {
|
||
background: #ffe6e6;
|
||
color: #d32f2f;
|
||
}
|
||
|
||
&.priority-medium {
|
||
background: #fff3e0;
|
||
color: #f57c00;
|
||
}
|
||
|
||
&.priority-low {
|
||
background: #e8f5e8;
|
||
color: #388e3c;
|
||
}
|
||
|
||
&.ok {
|
||
background: #e8f5e8;
|
||
color: #2e7d32;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.event-content {
|
||
padding: 30rpx 30rpx 0;
|
||
|
||
.event-description {
|
||
margin-bottom: 24rpx;
|
||
line-height: 1.6;
|
||
color: #333;
|
||
|
||
.line {
|
||
display: block;
|
||
}
|
||
}
|
||
|
||
.event-actions {
|
||
display: flex;
|
||
gap: 20rpx;
|
||
flex-wrap: wrap;
|
||
margin-bottom: 16rpx;
|
||
|
||
.event-action-btn {
|
||
padding: 16rpx 24rpx;
|
||
border: none;
|
||
border-radius: 12rpx;
|
||
font-size: 24rpx;
|
||
font-weight: 700;
|
||
color: #fff;
|
||
|
||
&.btn-primary {
|
||
background: @primary;
|
||
}
|
||
|
||
&.btn-success {
|
||
background: @ok;
|
||
}
|
||
|
||
&.btn-warning {
|
||
background: @warn;
|
||
color: #fff;
|
||
}
|
||
}
|
||
}
|
||
|
||
.event-status {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 10rpx;
|
||
font-size: 24rpx;
|
||
margin-top: 10rpx;
|
||
padding: 16rpx 20rpx;
|
||
background: @bg;
|
||
border-radius: 12rpx;
|
||
|
||
.status-dot {
|
||
width: 16rpx;
|
||
height: 16rpx;
|
||
border-radius: 50%;
|
||
|
||
&.status-processing {
|
||
background: @warn;
|
||
}
|
||
|
||
&.status-resolved {
|
||
background: @ok;
|
||
}
|
||
|
||
&.status-pending {
|
||
background: @danger;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.add-event-btn {
|
||
position: fixed;
|
||
bottom: 160rpx;
|
||
right: 40rpx;
|
||
width: 96rpx;
|
||
height: 96rpx;
|
||
background: linear-gradient(135deg, @primary, @primary2);
|
||
border-radius: 50%;
|
||
border: none;
|
||
color: #fff;
|
||
font-size: 40rpx;
|
||
box-shadow: 0 8rpx 24rpx rgba(74, 144, 226, .4);
|
||
}
|
||
|
||
.promo-banner {
|
||
margin: 30rpx;
|
||
border-radius: 24rpx;
|
||
overflow: hidden;
|
||
box-shadow: @shadow;
|
||
|
||
.promo-image {
|
||
width: 100%;
|
||
height: 240rpx;
|
||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: #fff;
|
||
font-size: 48rpx;
|
||
position: relative;
|
||
overflow: hidden;
|
||
|
||
.promo-content {
|
||
position: absolute;
|
||
bottom: 0;
|
||
left: 0;
|
||
right: 0;
|
||
background: linear-gradient(transparent, rgba(0, 0, 0, .7));
|
||
padding: 40rpx 30rpx 30rpx;
|
||
color: #fff;
|
||
|
||
.promo-title {
|
||
font-size: 32rpx;
|
||
font-weight: 700;
|
||
margin-bottom: 8rpx;
|
||
}
|
||
|
||
.promo-subtitle {
|
||
font-size: 24rpx;
|
||
opacity: .9;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.facilities-section {
|
||
margin: 30rpx;
|
||
background: #fff;
|
||
border-radius: 24rpx;
|
||
overflow: hidden;
|
||
box-shadow: @shadow;
|
||
|
||
.facilities-header {
|
||
background: linear-gradient(135deg, #20bf6b, #0fb9b1);
|
||
color: #fff;
|
||
padding: 30rpx;
|
||
font-weight: 700;
|
||
font-size: 32rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 16rpx;
|
||
}
|
||
}
|
||
|
||
.eventsPopupBox {
|
||
width: 90vw;
|
||
height: 80vh;
|
||
background-color: #fff;
|
||
border-radius: 16rpx;
|
||
box-sizing: border-box;
|
||
padding: 24rpx;
|
||
overflow-y: auto;
|
||
|
||
.eventsItemTitle {
|
||
width: 100%;
|
||
font-size: 28rpx;
|
||
font-weight: 600;
|
||
}
|
||
|
||
.eventsItem {
|
||
width: 100%;
|
||
margin-bottom: 16rpx;
|
||
display: flex;
|
||
align-items: flex-start;
|
||
|
||
.eventsLabel {
|
||
width: 200rpx;
|
||
text-align: left;
|
||
font-size: 26rpx;
|
||
}
|
||
|
||
.eventsValue {
|
||
flex: 1;
|
||
font-size: 24rpx;
|
||
}
|
||
}
|
||
|
||
.eventsSmallTitle {
|
||
margin: 16rpx 0;
|
||
width: 100%;
|
||
font-size: 28rpx;
|
||
font-weight: 600;
|
||
}
|
||
|
||
.eventsItemPic {
|
||
width: 100%;
|
||
|
||
.eventsLabel {
|
||
width: 200rpx;
|
||
text-align: left;
|
||
font-size: 26rpx;
|
||
}
|
||
|
||
.eventsPic {
|
||
flex: 1;
|
||
font-size: 24rpx;
|
||
|
||
.eventsPicItem {
|
||
width: 100rpx;
|
||
height: 100rpx;
|
||
margin-right: 8rpx;
|
||
margin-bottom: 8rpx;
|
||
|
||
.eventsPicImg {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
|
||
}
|
||
</style> |