YNUtdPlatform/pages/realName/workbench/electronicContractSign/contractPdf.vue

257 lines
6.8 KiB
Vue

<template>
<view class="page">
<u-navbar class="u-navbar" title="电子合同签署详情" placeholder @leftClick="leftClick" leftIconColor="#fff" bgColor="#00337A" :titleStyle="{ color: '#FFF', fontSize: '32rpx' }"/>
<view class="file-box">
<PdfView :path="webUrl" v-if="!showPopup" style="width: 100%;height: 90%!important;"/>
</view>
<view class="bottom-box">
<view class="btn1" @click="leftClick">返回</view>
<view class="btn1" @click="checkVideo">查看视频</view>
<view class="btn1" @click="handleSign">签署</view>
</view>
<u-popup :show="showPopup" mode="center" @close="closePopup">
<view style="width:600rpx;height: auto;position: relative;background-color: #fff;">
<view style="width: 100%;height: 80rpx;margin: 0 auto;display: flex;justify-content: space-between;align-items: center;background-color: #fff;">
<view style="width: 50%;height: 80rpx;line-height: 80rpx;font-weight: bold;margin-left: 40rpx;">签署合同</view>
<u-icon style="width: 10%;" name="close" color="#000" size="20" @click="closePopup"></u-icon>
</view>
<view style="width: 100%;height: 40vh;background-color: #fff;">
<view style="width: 96%;margin: 20rpx auto;padding:10rpx 0;">
<view style="font-weight: bold;margin-left: 20rpx;">法人签名/印章</view>
<view style="margin-left: 40rpx;margin-top: 20rpx;">
<image :src="signPath" style="width: 200rpx;height: 200rpx;" alt="">
</view>
</view>
<view style="width: 96%;margin: 20rpx auto;padding:10rpx 0;">
<view style="font-weight: bold;margin-left: 20rpx;">电子公章</view>
<view style="margin-left: 40rpx;margin-top: 20rpx;">
<image :src="sealPath" style="width: 200rpx;height: 200rpx;" alt="">
</view>
</view>
</view>
<view style="width: 96%;margin: 20rpx auto;display: flex;justify-content: space-between;">
<view style="width:40%;height:80rpx;line-height: 80rpx;text-align: center;background: #00337A;color: #FFF;border-radius: 10rpx;" @click="closePopup">取消</view>
<view style="width:40%;height:80rpx;line-height: 80rpx;text-align: center;background: #00337A;color: #FFF;border-radius: 10rpx;" @click="confirmSign">确认</view>
</view>
</view>
</u-popup>
</view>
</template>
<script>
import PdfView from '../../components/PdfView.vue'
import config from '@/config'
export default {
components: { PdfView },
data() {
return {
videoUrl:"",
webUrl:``,
showPopup:false,
contractData:{},
signData:{},
sealPath:"",
signPath:"",
}
},
onLoad(option) {
this.videoUrl=option.videoUrl||"";
this.webUrl=option.pdfUrl||"";
this.contractData=JSON.parse(option.contractData)||{};
console.log(this.webUrl)
console.log(this.videoUrl)
console.log(this.contractData)
this.getSubcontractor()
},
onShow() {
},
methods: {
//获取分包信息
getSubcontractor(){
let param={
id:uni.getStorageSync('realNameUser').subId,
proId:-1
}
uni.request({
url: config.realAppUrl + '/offLine/getSubcontractor',
method: 'post',
data: param,
header: {
'Content-Type': 'application/x-www-form-urlencoded',
Authorization: uni.getStorageSync('realNameToken')
},
success: res => {
res = res.data;
if(res.code==200){
console.log(res)
if(res.data.length>0){
this.signData = res.data[0]
this.sealPath = config.realFileUrl+res.data[0].sealPath;
this.signPath = config.realFileUrl+res.data[0].signPath;
// this.sealPath = config.realFileUrl+`ynRealName/face/2024/01/19/b0f9278cadbe4bdda05833b1300ad93520240117165256.jpg`;
// this.signPath = config.realFileUrl+`ynRealName/face/2024/01/19/b0f9278cadbe4bdda05833b1300ad93520240117165256.jpg`;
console.log(this.sealPath)
console.log(this.signPath)
}
}
},
fail: err => {
console.log(err)
}
})
},
//签署
handleSign(){
this.showPopup=true
},
closePopup(){
this.showPopup=false
},
confirmSign(){
// console.log(this.contractData)
if(this.contractData.isSign==0){
let param={
isSign:1,
legalSeal:this.signData.signPath,
companySeal:this.signData.sealPath,
subPdfUrl:this.contractData.personPdfUrl,
partBIdCard:this.contractData.partBIdCard,
id:this.contractData.id,
}
console.log(param)
this.showPopup=false;
uni.request({
url: config.realAppUrl+'/contract/updateSign',
method: 'post',
data: param,
header: {
'Content-Type': 'application/x-www-form-urlencoded',
Authorization: uni.getStorageSync('realNameToken')
},
success: res => {
console.log(res)
res = res.data;
if(res.code==200){
uni.showToast({
title: res.data,
icon: 'none'
})
this.getText()
uni.navigateBack({
delta: 1 // 返回
});
}else{
uni.showToast({
title: res.msg,
icon: 'none'
})
}
},
fail: err => {
console.log(err)
}
})
}
},
//短信
getText(){
let pathUrl = config.realFileUrl+this.contractData.personPdfUrl
let arr = pathUrl.split(".pdf")
let path = arr[0]+"_sign.pdf"
let shortText = "【作业管控智慧平台】" + this.contractData.partB + ",你的电子合同已签署成功,地址为:" + path;
console.log(shortText)
let param = {
ddtkey:"bonus",
secretkey:"KtyBns@Admin2023!",
mobile:this.contractData.partBPhone,
content:shortText
}
console.log(param)
uni.request({
url: "http://api.ktsms.cn/sms_token",
method: 'post',
data: param,
header: {
'Content-Type': 'application/x-www-form-urlencoded',
},
success: res => {
console.log(res)
if(res.data.split(",")[0]=="ok"){
uni.$u.toast('发送成功!');
}
},
fail: err => {
console.log(err)
}
})
},
//查看视频
checkVideo(){
uni.navigateTo({
url: `/pages/realName/workbench/electronicContractSign/contractVideo?videoUrl=${this.videoUrl}`
})
},
// 返回
leftClick() {
console.log('返回')
uni.navigateBack({
delta: 1 // 返回
});
}
},
}
</script>
<style lang="scss">
/deep/.u-popup .u-transition{
background-color: rgba(0, 0, 0, 0.8);
}
.page {
width: 100vw;
height: 100vh;
background-color: #EFEFEF;
box-sizing: border-box;
position: relative;
.file-box{
width: 100%;
height: 80vh;
// overflow-y: auto;
}
.bottom-box{
width: 90%;
margin: 0 auto;
height: 120rpx;
display: flex;
justify-content: space-between;
align-items: center;
.btn1{
width: 30%;
height: 80rpx;
display: flex;
align-items: center;justify-content: center;
color: #FFF;
background: #00337A;
border-radius: 10rpx;
}
.btn2{
width: 30%;
height: 80rpx;
display: flex;
align-items: center;justify-content: center;
color: #FFF;
background: #00337A;
border-radius: 10rpx;
}
}
}
</style>