288 lines
8.0 KiB
Vue
288 lines
8.0 KiB
Vue
<template>
|
||
<view>
|
||
<cu-custom bgColor="bg-gradual-blueness" :isBack="true">
|
||
<block slot="backText">返回</block>
|
||
<block slot="content">安全例会详情</block>
|
||
</cu-custom>
|
||
<scroll-view scroll-y>
|
||
<view class="dy-card">
|
||
<view class="dy-card-title">
|
||
<text>{{pd.MEETING_TITLE}}</text>
|
||
</view>
|
||
<view class="dy-card-content">
|
||
<view class="dy-card-content-item">
|
||
<text>主持人：</text>
|
||
<text>{{pd.HOST_PERSON}}</text>
|
||
</view>
|
||
<view class="dy-card-content-item">
|
||
<text>记录人：</text>
|
||
<text>{{pd.RECORDER}}</text>
|
||
</view>
|
||
<view class="dy-card-content-item">
|
||
<text>会议开始时间：</text>
|
||
<text>{{pd.MEETING_DATE_START}}</text>
|
||
</view>
|
||
<view class="dy-card-content-item">
|
||
<text>会议结束时间：</text>
|
||
<text>{{pd.MEETING_DATE_END}}</text>
|
||
</view>
|
||
<view class="dy-card-content-item">
|
||
<text>会议类型：</text>
|
||
<text>{{pd.MEETING_TYPE === '1' ? '安全生产例会' : pd.MEETING_TYPE === '2' ? '安全生产委员会会议' : ''}}</text>
|
||
</view>
|
||
<view class="dy-card-content-item">
|
||
<text>会议内容：</text>
|
||
<rich-text :nodes="pd.MEETING_CONTENT"></rich-text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="cu-tabbar-height"></view>
|
||
</scroll-view>
|
||
<uni-drawer ref="showHiddenWindow" mode="right" :mask-click="true">
|
||
<scroll-view scroll-y="true" style="height: 100vh;">
|
||
<!-- 实时照片部分 -->
|
||
<view class="cu-form-group image-upload-container">
|
||
<view class="title">实时照片：</view>
|
||
<view class="icon-upload" v-if="!livePhotos.length" @click="chooseImage('LIVEPHOTOS')">
|
||
<text class='cuIcon-cameraadd'></text>
|
||
</view>
|
||
<!-- 图片预览区 -->
|
||
<view class="image-preview" v-for="(photo, index) in livePhotos" :key="index">
|
||
<image :src="photo" mode="aspectFill" class="upload-image"></image>
|
||
<!-- 删除按钮 -->
|
||
<view class="delete-icon" @tap.stop="removeImage(index, 'LIVEPHOTOS')">
|
||
<text class='cuIcon-close'></text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 签字照片部分 -->
|
||
<view class="cu-form-group image-upload-container">
|
||
<view class="title">签字照片：</view>
|
||
<view class="icon-upload" v-if="!signaturePicture" @click="chooseImage('SIGNATUREPICTURE')">
|
||
<text class='cuIcon-edit'></text>
|
||
</view>
|
||
<!-- 图片预览区 -->
|
||
<view class="image-preview" v-if="signaturePicture">
|
||
<image :src="signaturePicture" mode="aspectFill" class="upload-image"></image>
|
||
</view>
|
||
<!-- 删除按钮 -->
|
||
<view>
|
||
<view class="delete-icon" @tap.stop="removeImage('SIGNATUREPICTURE')">
|
||
<text class='cuIcon-close'></text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
<button @click="saveAndCloseDrawer">保存并关闭</button>
|
||
</uni-drawer>
|
||
<view class="cu-form-group">
|
||
<view class="title">是否参会：</view>
|
||
<button class="cu-btn round bg-blue" @click="addHidden">参会</button>
|
||
</view>
|
||
|
||
<yk-authpup ref="authpup" type="top" @changeAuth="$noMultipleClicks(editLocation)" :permissionID="permissionID"></yk-authpup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
basePath,loginUser
|
||
} from '@/common/tool.js';
|
||
import ykAuthpup from "@/components/yk-authpup/yk-authpup"
|
||
export default {
|
||
components: {
|
||
ykAuthpup
|
||
},
|
||
data() {
|
||
return {
|
||
permissionID:'',
|
||
SAFETY_MEETING_ID : '',
|
||
varList:[],
|
||
pd:[],
|
||
noClick:true,
|
||
ACCIDENTS_NAME:"",
|
||
MEETING_TITLE:"",
|
||
MEETING_TYPE:"",
|
||
MEETING_ADDRESS:"",
|
||
HOST_PERSON:"",
|
||
MEETING_CONTENT:"",
|
||
RECORDER:"",
|
||
MEETING_DATE_START:"",
|
||
MEETING_DATE_END:"",
|
||
livePhotos: [],
|
||
signaturePicture: [],
|
||
}
|
||
},
|
||
onLoad(e){
|
||
var _this = this;
|
||
_this.SAFETY_MEETING_ID=e.id;
|
||
_this.getData();
|
||
|
||
},
|
||
methods: {
|
||
//跳转事件
|
||
goToEdit(e) {
|
||
uni.navigateTo({
|
||
url: '/pages/application/basic-info-manage/basic-information/basic-information-edit'
|
||
});
|
||
},
|
||
getData() {
|
||
var _this = this;
|
||
uni.showLoading({
|
||
title: '请稍候'
|
||
})
|
||
uni.request({
|
||
url: basePath + '/app/safetymeeting/goEdit',
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
header:{
|
||
'Content-type':'application/x-www-form-urlencoded'
|
||
},
|
||
data: {
|
||
SAFETY_MEETING_ID: _this.SAFETY_MEETING_ID,
|
||
CORPINFO_ID:loginUser.CORPINFO_ID,
|
||
USER_ID:loginUser.USER_ID,
|
||
},
|
||
success: (res) => {
|
||
if (res.data != null) {
|
||
uni.hideLoading();
|
||
_this.pd = res.data.pd;
|
||
} else {
|
||
uni.showToast({
|
||
title: res.data.message,
|
||
duration: 2000
|
||
});
|
||
}
|
||
}
|
||
});
|
||
},
|
||
|
||
addHidden() {
|
||
if (this.$refs.showHiddenWindow) {
|
||
this.$refs.showHiddenWindow.open();
|
||
}
|
||
this.creatorList = [{
|
||
NAME: loginUser.NAME,
|
||
USER_ID: loginUser.USER_ID
|
||
}]
|
||
this.$refs['showHiddenWindow'].open()
|
||
this.showHiddenWindow = true
|
||
this.hiddenIsEdit = true
|
||
},
|
||
chooseImage(type) {
|
||
uni.chooseImage({
|
||
count: 1, // 限制只能选择一张图片
|
||
success: (res) => {
|
||
if (type === 'LIVEPHOTOS' && res.tempFilePaths.length) {
|
||
this.livePhotos = res.tempFilePaths[0]; // 如果是单图，确保赋值字符串
|
||
} else if (type === 'SIGNATUREPICTURE' && res.tempFilePaths.length) {
|
||
this.signaturePicture = res.tempFilePaths[0]; // 确保赋值为字符串路径
|
||
}
|
||
},
|
||
});
|
||
},
|
||
removeImage(type) {
|
||
if (type === 'LIVEPHOTOS') {
|
||
this.livePhotos = []; // 清空数组即可移除图片
|
||
} else {
|
||
this.signaturePicture = null; // 设为null即可移除图片
|
||
}
|
||
},
|
||
|
||
openAuth(permissionID){
|
||
this.permissionID = permissionID;
|
||
setTimeout(()=>{
|
||
this.$refs['authpup'].open();
|
||
},200)
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
.dy-card {
|
||
background-color: #fff;
|
||
border-radius: 10upx;
|
||
margin: 30upx;
|
||
}
|
||
|
||
.dy-card-title {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
border-bottom: 1px solid #eee;
|
||
min-height: 80upx;
|
||
line-height: 80upx;
|
||
padding: 0 30upx;
|
||
}
|
||
|
||
.dy-card-content {
|
||
padding: 0upx 30upx 30upx;
|
||
}
|
||
|
||
.dy-card-content-item {
|
||
margin-top: 20upx;
|
||
}
|
||
|
||
.dy-card-content-item .title {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
/* 注释掉未使用的样式 */
|
||
/* .dy-card-content-item .title .l {
|
||
width: 10upx;
|
||
height: 30upx;
|
||
border-radius: 20upx;
|
||
background-color: #666;
|
||
margin-right: 10upx;
|
||
} */
|
||
|
||
.dy-card-content-item .content,
|
||
.dy-card-content-item .name text {
|
||
background-color: #F1F1F1;
|
||
padding: 10upx 14upx;
|
||
margin-top: 14upx;
|
||
line-height: 1.6;
|
||
display: inline-block; /* 如果需要显示为inline-block */
|
||
}
|
||
|
||
.image-upload-container {
|
||
position: relative;
|
||
padding: 10px;
|
||
}
|
||
|
||
.upload-image {
|
||
width: 100%; /* 宽度占满容器，根据需要调整 */
|
||
height: auto; /* 高度自适应 */
|
||
border-radius: 4px; /* 轻微圆角 */
|
||
}
|
||
|
||
.image-preview {
|
||
position: relative;
|
||
width: 90px; /* 根据需要调整 */
|
||
height: 90px; /* 根据需要调整 */
|
||
margin-right: 10px; /* 与下一张图片的间距 */
|
||
display: inline-block; /* 使图片并排显示 */
|
||
}
|
||
|
||
.delete-icon {
|
||
position: absolute;
|
||
top: -10px; /* 超出图片范围的一部分，根据需要调整 */
|
||
right: -10px; /* 超出图片范围的一部分，根据需要调整 */
|
||
background-color: #ff4949; /* 您的红色背景 */
|
||
width: 20px; /* 删除图标的大小，根据实际情况调整 */
|
||
height: 20px;
|
||
border-radius: 10px; /* 圆形 */
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
|
||
.delete-icon text {
|
||
color: white; /* 图标颜色为白色 */
|
||
font-size: 14px; /* 图标大小，根据需要调整 */
|
||
}
|
||
|
||
</style>
|