OfficeApp/subpkg/fixedAssets/fixedAssets.vue
2023-08-10 14:13:35 +08:00

308 lines
7.3 KiB
Vue

<template>
<view class="">
<view class="card">
<view class="top">
<image src="../../static/img/contract/company.png"></image>
<view class="title">
<view class="name">租赁公司名称</view>
<view class="type">公司类型</view>
<view class="code">社会代码1321346351615</view>
</view>
</view>
<view class="location">
<view class="left">
<uni-icons type="location"></uni-icons>
<text>地址:</text>
</view>
<view class="right">
泸州市江阳区通滩镇
</view>
</view>
<u-line color="#999999FF" style="margin: 21rpx 0;"></u-line>
<view class="center">
<view class="car">
<image src="../../static/logo.png" @click="priview('/static/logo.png')"></image>
<view class="right">
<view class="car_name">
<view class="name">三轮车</view>
<view>100天后到期</view>
</view>
<view class="time">租赁时间:2023-01-01 2024-01-01</view>
</view>
</view>
<view class="info">
<view>型号:电动三轮车</view>
<view>数量:1</view>
<view>租赁责任人:XXX</view>
<view>联系方式:110120130</view>
</view>
</view>
<view class="bottom">
<view class="title">租赁合同附件</view>
<view class="contract">
<view class="left">
<image class="contract_img" src="../../static/img/contract/pdf.png"></image>
<view class="text">
<view class="name">三轮车租赁合同</view>
<view>
<!-- <text class="nickname">张郭郭</text> -->
<text>2023年01月01日</text>
</view>
</view>
</view>
<view class="right" @click="navTo(contract.contract_no)">
<!-- <image class="icon"></image> -->
<uni-icons type="paperclip" color="#3274F9"></uni-icons>
<view>查看</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import { download_file } from "@/api/junziqian.js"
export default {
data() {
return {
}
},
onLoad() {},
onShow() {},
methods: {
navTo(contract_no) {
download_file({ applyNo: contract_no }).then(res => {
if (res.code != 1) {
Toast(res.msg)
}
uni.navigateTo({
url: `/subpkg/pdfView/pdfView?url=${res.data.url}`
})
})
},
//查看图片
priview(url) {
uni.previewImage({
urls: [url],
longPressActions: {
itemList: ['保存图片'],
success: function(data) {
if (data.tapIndex === 0) {
uni.saveImageToPhotosAlbum({
filePath: url,
success: function() {
uni.showToast({
title: '保存成功',
icon: 'success'
})
},
fail: function() {
uni.showToast({
title: '保存失败',
icon: 'none'
})
}
})
}
}
}
})
},
},
onPullDownRefresh() {
uni.stopPullDownRefresh()
}
}
</script>
<style lang="scss">
.card {
margin: 0 auto;
margin-top: 28rpx;
padding: 28rpx;
width: 694rpx;
// height: 913rpx;
background: #FFFFFF;
border-radius: 14rpx 14rpx 14rpx 14rpx;
opacity: 1;
.top {
display: flex;
image {
width: 140rpx;
height: 140rpx;
margin-right: 28rpx;
}
.title {
display: flex;
flex-direction: column;
justify-content: space-around;
.name {
font-size: 32rpx;
font-weight: 500;
color: #333333;
}
.type {
font-size: 28rpx;
font-weight: 500;
color: #3274F9;
}
.code {
font-size: 25rpx;
font-weight: 400;
color: #999999;
}
}
}
.location {
display: flex;
font-size: 28rpx;
font-weight: 400;
color: #666666;
line-height: 35rpx;
margin-top: 24rpx;
.right {
flex: 1;
}
}
.center {
.car {
display: flex;
image {
width: 140rpx;
height: 140rpx;
margin-right: 28rpx;
}
.right {
display: flex;
flex-direction: column;
justify-content: space-around;
.car_name {
display: flex;
justify-content: space-between;
font-size: 28rpx;
font-weight: 500;
color: #3274F9;
.name {
font-size: 32rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: rgba(0, 0, 0, 0.8);
line-height: 35rpx;
}
}
.time {
font-size: 28rpx;
font-weight: 400;
color: #666666;
line-height: 35rpx;
}
}
}
.info {
margin-top: 21rpx;
font-size: 28rpx;
font-weight: 400;
color: #666666;
line-height: 45rpx;
}
}
.bottom{
.title{
font-size: 32rpx;
font-weight: 500;
color: #333333;
display: flex;
align-items: center;
margin: 28rpx 0;
&::before{
content: "";
width: 6rpx;
height: 32rpx;
border-radius: 6rpx;
margin-right: 12rpx;
display: inline-block;
background-color: $theme-oa-color;
}
}
.contract {
display: flex;
justify-content: space-between;
.left {
display: flex;
.contract_img {
width: 102rpx;
height: 102rpx;
background: #F5F5F5;
border-radius: 14rpx 14rpx 14rpx 14rpx;
margin-right: 21rpx;
}
.text {
display: flex;
flex-direction: column;
justify-content: space-between;
.name {
font-size: 32rpx;
font-weight: 500;
color: rgba(0, 0, 0, 0.8);
line-height: 35rpx;
}
.nickname {
margin-right: 35rpx;
}
text {
height: 39rpx;
font-size: 28rpx;
font-weight: 400;
color: #666666;
line-height: 35rpx;
}
}
}
.right {
font-size: 28rpx;
font-weight: 500;
color: $theme-oa-color;
line-height: 35rpx;
display: flex;
justify-content: center;
align-items: center;
.icon {
width: 35rpx;
height: 39rpx;
background-color: $theme-oa-color;
opacity: 1;
margin-right: 10rpx
}
}
}
}
}
</style>