caoliancun/wx_oms
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

更新

Browse Source
This commit is contained in:
xiaozhiyong
2024-02-21 10:44:24 +08:00
parent b1726eba38
commit 1410072142
5 changed files with 587 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

211
contractManagement/list/details.vue Normal file
View File

@@ -0,0 +1,211 @@
<template>
<view>
<view class="header">
<view :style="{height:styles.top+'px'}"></view>
<uni-nav-bar @clickLeft='back' :border="false" color='white' backgroundColor="rgba(0,0,0,0)"
left-icon="back" title="合同详情" />
</view>
<view class="list">
<view class="item" v-for="item,index in infoList" :key="index">
<text>{{item.title}}</text>
<text v-if="item.type == 'text'">{{item.value}}</text>
<text v-if="item.type == 'date'" :style="{ color: dateHandle(item.value) }">{{item.value}}</text>
<text v-if="item.type == 'selector'">{{item.value}}</text>
<text v-if="item.type == 'number'">{{ item.value }}</text>
<template v-if="item.type == 'file'">
<text v-if="!item.value">暂无</text>
<template v-else>
<view v-if="item.value.endsWith('png') || item.value.endsWith('jpg')" class="file"
@click="seePicture(item.value)">
<image :src="item.value"></image>
<text>{{item.value | nameFilters}}</text>
</view>
<view v-else class="file-download" @click="seeDocument(item.value)">
<image src="https://publicxingyou.oss-cn-hangzhou.aliyuncs.com/mp-oil/oms-file.png"></image>
<image src="https://publicxingyou.oss-cn-hangzhou.aliyuncs.com/mp-oil/eye.png"></image>
</view>
</template>
</template>
</view>
</view>
<uni-popup ref="popup" background-color="#fff">
<view class="picture-frame">
<image mode="widthFix" :src="picture"></image>
<image src="https://publicxingyou.oss-cn-hangzhou.aliyuncs.com/mp-oil/red-close.png"
@click="closePicture"></image>
</view>
</uni-popup>
</view>
</template>
<script>
import serve from '@/api/contractManagement/list.js'
export default {
data() {
return {
styles: {},
infoList: [],
today: new Date().getTime(),
picture: ''
}
},
onLoad(option) {
this.styles = uni.getMenuButtonBoundingClientRect()
if (option.details) {
this.infoList = JSON.parse(option.details)
}
console.log(this.infoList)
},
filters: {
nameFilters(name) {
if (!name) return ''
let arr = name.split('/')
return arr[arr.length - 1]
}
},
methods: {
dateHandle(val) {
let dueTime = new Date(val).getTime()
return this.today > dueTime ? '#ff0000' : '#333'
},
seePicture(img) {
this.picture = img
this.$refs.popup.open('center')
},
closePicture() {
this.picture = ''
this.$refs.popup.close()
},
seeDocument(url) {
uni.downloadFile({
url: url,
success: (res) => {
uni.openDocument({
filePath: res.tempFilePath,
success: (_res1) => {
console.log(_res1)
},
fail: (_res2) => {
console.log('_res2',_res2)
uni.showToast({
title: '该文件格式暂不支持在线预览',
icon: 'none'
})
},
})
}
})
},
back() {
uni.navigateBack()
},
}
}
</script>
<style lang="scss">
page {
background: #dddddd80;
}
.picture-frame {
position: relative;
>image {
&:nth-of-type(1) {
vertical-align: middle;
width: 650rpx;
}
&:nth-of-type(2) {
position: absolute;
top: -80rpx;
right: 0;
width: 50rpx;
height: 50rpx;
}
}
}
.header {
position: relative;
width: 100%;
height: 350rpx;
background: url('https://xoi-support.oss-cn-hangzhou.aliyuncs.com/星油admin小程序/sjbj.png') center/100% no-repeat;
}
.list {
position: relative;
top: -80rpx;
margin: 0 auto;
// padding-bottom: 30rpx;
min-height: calc(100vh - 350rpx);
width: 96%;
padding: 20rpx 20rpx 30rpx 30rpx;
background: #fff;
border-radius: 15rpx;
.item {
margin-bottom: 27rpx;
>text {
&:nth-of-type(1) {
display: inline-block;
margin-right: 50rpx;
width: 150rpx;
color: #999;
}
&:nth-of-type(1) {
vertical-align: top;
}
}
}
.file {
display: inline-flex;
align-items: center;
padding: 0 10rpx;
width: 420rpx;
height: 100rpx;
background: #99999930;
border-radius: 10rpx;
image {
margin-right: 15rpx;
width: 80rpx;
height: 80rpx;
border-radius: 10rpx;
}
text {
flex: 1;
font-size: 22rpx;
}
}
.file-download {
display: inline;
image {
&:nth-of-type(1) {
// margin-right: 15rpx;
width: 80rpx;
height: 80rpx;
border-radius: 10rpx;
}
&:nth-of-type(2) {
position: relative;
left: -5rpx;
bottom: -5rpx;
width: 32rpx;
height: 32rpx;
}
}
}
}
</style>

332
contractManagement/list/index.vue Normal file
View File

@@ -0,0 +1,332 @@
<template>
<view style="height: 100vh;display: flex;flex-direction: column;">
<view class="header">
<view :style="{height:styles.top+'px'}"></view>
<uni-nav-bar @clickLeft='back' :border="false" color='white' backgroundColor="rgba(0,0,0,0)"
left-icon="back" title="合同列表" />
<view class="seach">
<uni-easyinput @confirm='seachFn' style="border-radius:12rpx ;" prefixIcon="search"
placeholder-style="color:#bbb;font-weight: 100;" confirmType="搜索"
v-model="paramter.params.companyName" placeholder="请输入对方单位名称">
</uni-easyinput>
</view>
</view>
<view style="flex:1;overflow: hidden;">
<view v-if="!tableList.length"
style="width: 100vw; height: 100%; display: flex;align-items: center;justify-content: center;">
<image src="@/static/qx.png" style="width: 500rpx; height: 355rpx;"></image>
</view>
<scroll-view style="height: 100%;" scroll-y="true" @scrolltolower='scrolltolower'>
<view class="container">
<view class="item" v-for="item,index in tableList" :key="index"
@tap="jump(item)">
<view>
<text>对方单位名称</text>
<text>{{item.companyName}}</text>
</view>
<view>
<text>审批流程</text>
<text>{{item.spName}}</text>
</view>
<view>
<text>合同编号</text>
<text>{{item.contractNo}}</text>
</view>
<view>
<view>
<text>签约日期</text>
<text>{{item.signingTime | timeFilter}}</text>
</view>
<view>
<text>到期时间</text>
<text>{{item.contractTime | timeFilter}}</text>
</view>
</view>
<view>
<text>我方负责人</text>
<text>{{item.applyer}}</text>
</view>
<view :style="{
color:statusEnum.find(_item => _item.value == item.spStatus).color,
backgroundColor:statusEnum.find(_item => _item.value == item.spStatus).backgroundColor,
bordercolor:statusEnum.find(_item => _item.value == item.spStatus).bordercolor
}">
{{statusEnum.find(_item => _item.value == item.spStatus).label}}
</view>
</view>
</view>
</scroll-view>
</view>
</view>
</template>
<script>
import serve from '@/api/contractManagement/list.js'
export default {
data() {
return {
styles: {},
paramter: {
currentPage: 1,
pageSize: 10,
params: {
companyName: ''
}
},
tableList: [],
statusEnum: [{
value: '1',
label: '审批中',
backgroundColor: '#fff8e6',
bordercolor: '#fff1cc',
color: '#ffba00',
},
{
value: '2',
label: '已通过',
backgroundColor: '#e7faf0',
bordercolor: '#d0f5e0',
color: '#13ce66',
},
{
value: '3',
label: '已驳回',
backgroundColor: '#fef0f0',
bordercolor: '#fde2e2',
color: '#f56c6c',
},
{
value: '4',
label: '已撤销',
backgroundColor: '#f4f4f5',
bordercolor: '#e9e9eb',
color: '#909399',
},
{
value: '6',
label: '通过后撤销',
backgroundColor: '#f4f4f5',
bordercolor: '#e9e9eb',
color: '#909399',
},
{
value: '7',
label: '已删除',
backgroundColor: '#fef0f0',
bordercolor: '#fde2e2',
color: '#f56c6c',
},
{
value: '10',
label: '已支付',
backgroundColor: '#e7faf0',
bordercolor: '#d0f5e0',
color: '#13ce66',
}
]
}
},
onLoad() {
this.styles = uni.getMenuButtonBoundingClientRect()
this.getByPage()
},
filters: {
timeFilter(value) {
if (value) {
return value.split(' ')[0]
}
}
},
methods: {
seachFn() {
this.tableList = []
this.paramter.currentPage = 1
this.getByPage()
// console.log('seachFn')
},
getByPage() {
serve.getByPage(this.paramter).then(res => {
if (!res.data.list.length) {
uni.showToast({
title: '没有更多数据了哦~',
icon: 'none'
})
return
}
this.tableList = this.tableList.concat(res.data.list);
})
},
// 触底加载
scrolltolower() {
this.paramter.currentPage += 1
this.getByPage()
},
handlerNumber(number) {
if (number == 0) return number
if (!number) {
return '--'
}
return +number.toFixed(2)
},
back() {
uni.navigateBack()
},
jump(item) {
uni.navigateTo({
url: `./details?details=${item.details}`
})
},
}
}
</script>
<style lang="scss">
.uni-easyinput__content {
background-color: #fff;
}
.header {
position: relative;
width: 100%;
min-height: 403rpx;
background: url('https://xoi-support.oss-cn-hangzhou.aliyuncs.com/星油admin小程序/sjbj.png') center/100% no-repeat;
}
.header .seach {
margin-top: 60rpx;
padding: 0 50rpx;
}
.container {
padding: 30rpx 40rpx;
.item {
position: relative;
margin-bottom: 15rpx;
background: #fff;
padding-bottom: 20rpx;
>view {
padding-left: 20rpx;
font-size: 25rpx;
text {
&:nth-of-type(1) {
color: #999;
}
&:nth-of-type(2) {
margin-left: 60rpx;
}
}
&:nth-of-type(1) {
position: relative;
width: 100%;
height: 70rpx;
line-height: 77rpx;
&::after {
content: '';
position: absolute;
left: 50%;
bottom: 0;
transform: translateX(-50%);
width: 95%;
height: 1rpx;
background: #33333350;
}
text {
&:nth-of-type(2) {
float: right;
margin-right: 20rpx;
}
}
}
&:nth-of-type(2),
&:nth-of-type(3) {
margin-top: 17rpx;
}
&:nth-of-type(4) {
display: flex;
margin-top: 17rpx;
>view {
&:nth-of-type(2) {
margin-left: 35rpx;
}
}
}
&:nth-of-type(5) {
margin-top: 17rpx;
text {
&:nth-of-type(2) {
margin-left: 37rpx;
}
}
}
&:nth-of-type(6) {
position: absolute;
top: 85rpx;
right: 20rpx;
padding: 0;
width: 120rpx;
height: 60rpx;
line-height: 56rpx;
text-align: center;
border: 1rpx solid;
border-radius: 8rpx;
}
}
}
}
// .container .item {
// position: relative;
// margin-bottom: 25rpx;
// padding-top: 60rpx;
// height: 200rpx;
// width: 100%;
// background: #fff;
// /* border: 1px solid #333; */
// border-radius: 10rpx;
// }
// .container .item .logo {
// position: absolute;
// left: 20rpx;
// top: 50%;
// transform: translateY(-50%);
// width: 100rpx;
// height: 100rpx;
// border-radius: 50%;
// /* border: 1px solid #333; */
// }
// .container .item view {
// padding-left: 150rpx;
// }
// .container .item view:nth-of-type(1) {
// /* margin-top: 57rpx; */
// color: #333;
// font-size: 30rpx;
// font-weight: 550;
// }
// .container .item view:nth-of-type(2) {
// margin-top: 10rpx;
// color: #778899;
// font-size: 24rpx;
// }
</style>