OfficeApp/pages/oaHome/homeTaskDetail.vue
2024-01-21 18:15:55 +08:00

94 lines
1.6 KiB
Vue

<template>
<view class="box">
<view class="head">
<u--image :showLoading="true" width="60rpx" height="60rpx"
:src="'../../static/newWork/index/XQ.png'"></u--image>
<view class="title">
{{taskDetail.title }}
</view>
</view>
<view class="content">
{{taskDetail.content }}
<view class="time">
完成时间: {{taskDetail.end_time}}
</view>
</view>
</view>
</template>
<script>
import {
taskListApi
} from "@/api/task.js"
export default {
data() {
return {
taskDetail: {},
loading: true
}
},
onLoad(option) {
taskListApi().then(res => {
this.taskDetail = res.data.filter((item) => item.id == option.id)[0]
this.loading = false
console.log(this.taskDetail)
})
}
}
</script>
<style lang="scss" scoped>
.box {
width: 100vw;
height: 100vh;
background-color: #F9FBFF;
box-sizing: border-box;
padding: 30rpx;
.head {
// width: ;
display: flex;
.title {
width: 640rpx;
border: 1px solid #4C80F6;
border-radius: 20rpx;
height: 60rpx;
line-height: 60rpx;
box-sizing: border-box;
padding-left: 20rpx;
margin-left: 20rpx;
font-size: 28rpx;
color: #1A1A1A;
}
}
.content {
width: 690rpx;
background-color: white;
border-radius: 30rpx;
margin-top: 20rpx;
box-shadow: 0.5rpx 0.5rpx 200rpx 0.5rpx rgba(0, 0, 0, 0.1);
padding: 30rpx 30rpx 50rpx 30rpx;
box-sizing: border-box;
min-height: 35vh;
position: relative;
font-size: 26rpx;
color: #1A1A1A;
}
.time {
position: absolute;
bottom: 20rpx;
right: 20rpx;
color: #7A7A7A;
font-size: 24rpx;
}
}
</style>