YNUtdPlatform/pages/realName/workbench/electronicContractExam/index.vue

528 lines
15 KiB
Vue
Raw Normal View History

2024-09-29 10:19:21 +08:00
<template>
<view class="page">
<u-navbar class="u-navbar" title="电子合同审核" placeholder @leftClick="leftClick" leftIconColor="#fff" bgColor="#00337A" :titleStyle="{ color: '#FFF', fontSize: '32rpx' }"></u-navbar>
<view class="tab-box">
<view class="tab-item" :class="currentTabIndex == 0 ? 'active' : ''" @click="currentTabIndex = 0">
待审核
<view class="activeLine" v-if="currentTabIndex == 0"></view>
</view>
<view class="tab-item" :class="currentTabIndex == 1 ? 'active' : ''" @click="currentTabIndex = 1">
已审核
<view class="activeLine" v-if="currentTabIndex == 1"></view>
</view>
</view>
<scroll-view class="content" scroll-y="true">
<view class="view-box" v-show="currentTabIndex == 0">
<view style="width: 96%;padding:20rpx;margin: 0 auto;background: #FFF;margin-bottom: 20rpx;">{{proName}}</view>
<view class="form-box">
<view class="form-input-box">
<view style="width:70%;height: 100%;">
<u--input v-model="keyWord" type="text" placeholder="请输入关键字" maxlength="20" border="surround" clearable></u--input>
</view>
<view class="submitBtn" style="width: 15%;" @click="searchList">搜索</view>
<!-- <view class="submitBtn" style="width: 15%;">批量审核</view> -->
</view>
</view>
<view v-if="listData.length==0" style="width: 96%;height: 60vh;display: flex;flex-direction: column;justify-content: center;align-items: center;" >
<image src="../../../../static/realName/noData.png" style="width: 100rpx;height: 120rpx;" mode=""></image>
<view>暂无数据</view>
</view>
<u-list height="72vh" v-if="listData.length>0">
<u-list-item v-for="(item, index) in listData" :key="index">
<view class="list-item" @click="goDetail(item)">
<view class="content-box">
<view class="item-text" >
<text class="label" style="font-weight: bold;">姓名</text>
<text class="info">{{item.partB}}</text>
</view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">工种</text>
<text class="info">{{item.workType}}</text>
</view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">身份证</text>
<text class="info">{{item.partBIdCard}}</text>
</view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">核定工资方式</text>
<text class="info">{{item.verMethod}}</text>
</view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">核定工资标准</text>
<text class="info">{{item.verStand}}</text>
</view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">工作地点</text>
<text class="info">{{item.workAdress}}</text>
</view>
<view style="border-bottom: 2rpx solid #ccc;width: 94%;margin: 10rpx auto;"></view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">甲方</text>
<text class="info">{{item.partA}}</text>
</view>
<view style="border-bottom: 2rpx solid #ccc;width: 94%;margin: 10rpx auto;"></view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">生效日期</text>
<text class="info">{{item.effectDate}}</text>
</view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">签订日期</text>
<text class="info">{{item.signingDate}}</text>
</view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">签订状态</text>
<text class="info" v-if="item.isSign==0" style="color: red;">未签署</text>
<text class="info" v-if="item.isSign==1" style="color: #06E7A3;">已签署</text>
</view>
</view>
</view>
</u-list-item>
</u-list>
</view>
<view class="view-box" v-show="currentTabIndex == 1">
<view style="width: 96%;padding:20rpx;margin: 0 auto;background: #FFF;margin-bottom: 20rpx;">{{proName}}</view>
<view class="form-box">
<view class="form-input-box">
<view style="width: 70%;height: 100%;">
<u--input v-model="keyWord1" type="text" placeholder="请输入关键字" maxlength="20" border="surround" clearable></u--input>
</view>
<view class="submitBtn" style="width: 15%;" @click="searchList">搜索</view>
</view>
</view>
<view v-if="listData.length==0" style="width: 96%;height: 60vh;display: flex;flex-direction: column;justify-content: center;align-items: center;" >
<image src="../../../../static/realName/noData.png" style="width: 100rpx;height: 120rpx;" mode=""></image>
<view>暂无数据</view>
</view>
<u-list height="72vh" v-if="listData.length>0">
<u-list-item v-for="(item, index) in listData" :key="index">
<view class="list-item" @click="goDetail(item)">
<view class="content-box">
<view class="item-text" >
<text class="label" style="font-weight: bold;">姓名</text>
<text class="info">{{item.partB}}</text>
</view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">工种</text>
<text class="info">{{item.workType}}</text>
</view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">身份证</text>
<text class="info">{{item.partBIdCard}}</text>
</view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">核定工资方式</text>
<text class="info">{{item.verMethod}}</text>
</view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">核定工资标准</text>
<text class="info">{{item.verStand}}</text>
</view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">工作地点</text>
<text class="info">{{item.workAdress}}</text>
</view>
<view style="border-bottom: 2rpx solid #ccc;width: 94%;margin: 10rpx auto;"></view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">甲方</text>
<text class="info">{{item.partA}}</text>
</view>
<view style="border-bottom: 2rpx solid #ccc;width: 94%;margin: 10rpx auto;"></view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">生效日期</text>
<text class="info">{{item.effectDate}}</text>
</view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">签订日期</text>
<text class="info">{{item.signingDate}}</text>
</view>
<view class="item-text" >
<text class="label" style="font-weight: bold;">签订状态</text>
<text class="info" v-if="item.isSign==0" style="color: red;">未签署</text>
<text class="info" v-if="item.isSign==1" style="color: #06E7A3;">已签署</text>
</view>
</view>
</view>
</u-list-item>
</u-list>
</view>
</scroll-view>
</view>
</template>
<script>
import { pathToBase64, base64ToPath } from 'image-tools';
import config from '@/config'
export default {
data() {
return {
currentTabIndex:0,
proId:uni.getStorageSync('realNameUser').proId,
proName:"",
teamId:uni.getStorageSync('realNameUser').teamId,
userId:uni.getStorageSync('realNameUser').userId,
keyWord:"",
keyWord1:"",
formData:{
userName:"",
},
listData:[],
}
},
onLoad(option) {
this.getPro()
this.listData=[]
this.contractExamineQueryList(0)
},
onShow() {
if (this.currentTabIndex == 1) {
this.contractExamineQueryList(1)
} else {
this.contractExamineQueryList(0)
}
},
watch: {
currentTabIndex: function(newVal, oldVal) {
if (newVal == 1) {
this.listData=[]
this.contractExamineQueryList(1)
} else {
this.listData=[]
this.contractExamineQueryList(0)
}
}
},
methods: {
// 获取工程名称
getPro(){
let param={
id:this.proId,
subId:-1
}
uni.request({
url: config.realAppUrl + '/offLine/getPro',
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)
this.proName = res.data[0].abbreviation||"";
}
},
fail: err => {
console.log(err)
}
})
},
searchList(){
if (this.currentTabIndex == 1) {
this.contractExamineQueryList(1)
} else {
this.contractExamineQueryList(0)
}
},
//获取列表
contractExamineQueryList(type){
let param={
isNotAudit:type,
proId:uni.getStorageSync('realNameUser').proId,
keyWord:this.keyWord,
}
if(type==1){
param.keyWord=this.keyWord1;
}
console.log(param)
this.listData=[]
uni.request({
url: config.realAppUrl+'/contract/contractExamineQueryList',
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){
this.listData=res.data;
}else{
uni.showToast({
title: res.msg,
icon: 'none'
})
}
},
fail: err => {
console.log(err)
}
})
},
goDetail(item){
let url=config.realFileUrl+ item.personPdfUrl;
uni.navigateTo({
url: `/pages/realName/workbench/electronicContractExam/contractPdf?pdfUrl=${url}`
})
},
leftClick() {
console.log('返回')
uni.navigateBack({
delta: 1 // 返回
});
},
timeFormat(dateTime = null, formatStr = 'yyyy-mm-dd') {
let date
// 若传入时间为假值,则取当前时间
if (!dateTime) {
date = new Date()
}
// 若为unix秒时间戳则转为毫秒时间戳逻辑有点奇怪但不敢改以保证历史兼容
else if (/^\d{10}$/.test(dateTime?.toString().trim())) {
date = new Date(dateTime * 1000)
}
// 若用户传入字符串格式时间戳new Date无法解析需做兼容
else if (typeof dateTime === 'string' && /^\d+$/.test(dateTime.trim())) {
date = new Date(Number(dateTime))
}
// 处理平台性差异在Safari/Webkit中new Date仅支持/作为分割符的字符串时间
// 处理 '2022-07-10 01:02:03',跳过 '2022-07-10T01:02:03'
else if (typeof dateTime === 'string' && dateTime.includes('-') && !dateTime.includes('T')) {
date = new Date(dateTime.replace(/-/g, '/'))
}
// 其他都认为符合 RFC 2822 规范
else {
date = new Date(dateTime)
}
const timeSource = {
'y': date.getFullYear().toString(), // 年
'm': (date.getMonth() + 1).toString().padStart(2, '0'), // 月
'd': date.getDate().toString().padStart(2, '0'), // 日
'h': date.getHours().toString().padStart(2, '0'), // 时
'M': date.getMinutes().toString().padStart(2, '0'), // 分
's': date.getSeconds().toString().padStart(2, '0') // 秒
// 有其他格式化字符需求可以继续添加,必须转化成字符串
}
for (const key in timeSource) {
const [ret] = new RegExp(`${key}+`).exec(formatStr) || []
if (ret) {
// 年可能只需展示两位
const beginIndex = key === 'y' && ret.length === 2 ? 2 : 0
formatStr = formatStr.replace(ret, timeSource[key].slice(beginIndex))
}
}
return formatStr
},
},
}
</script>
<style lang="scss">
.page {
width: 100vw;
height: 100vh;
background-color: #EFEFEF;
box-sizing: border-box;
.tab-box {
width: 100%;
margin: 0rpx auto;
padding-top: 20rpx;
display: flex;
justify-content: space-between;
background-color: #FFF;
.tab-item {
height: 70upx;
width: 45%;
font-size: 30upx;
text-align: center;
line-height: 70upx;
color: #666;
}
.active {
color: #00337A;
border-radius: 10upx 10upx 0 0;
font-weight: bold;
}
.activeLine{
background: #00337A;
border-radius: 10upx;
width: 100%;
height: 6upx;
}
}
.submitBtn{
width: 10%;
height: 50rpx;
line-height: 50rpx;
border-radius: 10rpx;
background: #00337A;
color: #FFF;
padding: 10rpx 16rpx;
text-align: center;
}
.content{
width: 100%;
height: 84vh;
margin-top: 20rpx;
// padding-bottom: 80rpx;
background-color: #EFEFEF;
}
// padding: 0 20px;
.map-box{
width: 100%;
height: 68vh;
z-index: 9;
position: absolute;
bottom:1vh;
background: #fff;
.map{
display: inline-block;
width: 100%;
height: 100%;
}
}
.view-box{
width: 100%;
height: auto;
margin: 0rpx auto;
border-radius: 10rpx;
padding-top: 20rpx;
// background-color: red;
.title-view{
font-weight: 600;
margin-left: 20rpx;
border-bottom: 1rpx solid #EFEFEF;
}
.form-box{
width: 100%;
height: auto;
font-size: 26rpx;
background-color: #FFF;
.form-input-box{
padding: 0 10rpx;
display: flex;
align-items: center;
justify-content: space-between;
}
}
.view-item{
width: 94%;
margin: 0rpx auto;
padding:10rpx;
display: flex;
border-bottom: 1rpx solid #EFEFEF;
font-size: 26rpx;
.label{
width: 160rpx;
color: #666;
margin-bottom: 10rpx;
}
.img-box{
width: 94%;
height: auto;
margin: 0rpx auto;
padding:10rpx;
display: flex;
border-bottom: 1rpx solid #EFEFEF;
.img-item {
float: left;
width: 200upx;
height: 200upx;
border: 1px solid #ddd;
margin: 0 22rpx 20upx 0upx;
position: relative;
box-sizing: border-box;
background: #eee;
.img {
display: block;
width: 100%;
height: 100%;
}
.remove-btn {
position: absolute;
top: -18upx;
right: -18upx;
width: 44upx;
height: 44upx;
z-index: 2;
}
}
.upload-btn {
display: flex;
justify-content: center;
align-items: center;
.img {
width: 60upx;
height: 60upx;
margin: unset;
}
}
}
}
.sumbit-btn{
width: 94%;
height: 80rpx;
margin: 0 auto;
margin-bottom: 100rpx;
display: flex;align-items: center;justify-content: center;
background: #00337A;
color: #FFF;
border-radius: 10rpx;
}
}
.list-item{
width: 100%;
height: auto;
// background-color: #fff;
border-radius: 20rpx;
margin: 20rpx 0;
.content-box{
width: 94%;
height: auto;
margin: 20rpx;
background-color: #F2F6F9;
padding: 10rpx 0;
.item-text{
width: 95%;
margin-left: 20rpx;
margin-top: 15rpx;
// display: flex;
align-items: center;
position: relative;
.label{
color: #3A3A3A;
// font-weight: 500;
}
.info-right{
position: absolute;
top: 0rpx;
right: 40rpx;
}
.info{
color: #6F6F6F;
}
}
}
}
}
</style>