OfficeApp/components/task/taskItem.vue

167 lines
4.5 KiB
Vue
Raw Normal View History

2023-08-04 11:32:51 +08:00
<template>
2023-08-05 19:07:46 +08:00
<view class="c_task_item" @click="clickTask">
2023-08-04 11:32:51 +08:00
<view class="top">
<view class="left">
<view>任务名称:</view>
2023-08-05 19:07:46 +08:00
<view class="text">{{datas.title}}</view>
2023-08-04 11:32:51 +08:00
</view>
<view class="right">
<image class="icon" src="../../static/icons/ok_c.png"></image>
<!-- <image src="../../static/icons/err_c.png"></image> -->
</view>
</view>
2023-08-05 11:11:27 +08:00
<view class="bottom">
<image class="b_left" src="../../static/img/task/task.png"></image>
<view class="b_right">
<view class="item">
<view class="left">
2023-08-15 18:27:07 +08:00
<view>任务状态:</view>
<view class="text">
2023-08-16 15:53:56 +08:00
<text v-if="datas.status==2||datas.status==1" style="color: #ff7c32;">
2023-08-16 16:07:39 +08:00
<block v-if="(datas.type==31||datas.type==32||datas.type==33)">
<block v-if="datas.extend&&datas.extend.informationg">{{(datas.extend.informationg.update?datas.extend.informationg.update:0)+'/'+(datas.extend.informationg.count?datas.extend.informationg.count:0)}}</block>
<block v-else-if="datas.extend&&datas.extend.transaction&&datas.extend.transaction.arr">{{(datas.extend.transaction.arr.total_price?datas.extend.transaction.arr.total_price:0)+'元/'+(datas.extend.transaction.arr.day_money?datas.extend.transaction.arr.day_money:0)+'元'}}</block>
<block v-else>进行中</block>
</block>
2023-08-16 15:53:56 +08:00
<block v-else>进行中</block>
</text>
2023-08-15 18:27:07 +08:00
<text v-if="datas.status==3" style="color: #46be61;">已完成</text>
<text v-if="datas.status==5">已关闭</text>
</view>
2023-08-05 11:11:27 +08:00
</view>
2023-08-05 19:07:46 +08:00
<view class="right">{{datas.money||'0.00'}}<text class="price"></text></view>
2023-08-05 11:11:27 +08:00
</view>
<view class="item">
<view class="left">
<view>完成时间:</view>
2023-08-05 19:07:46 +08:00
<view class="text">{{datas.end_time}}</view>
2023-08-05 11:11:27 +08:00
</view>
<view class="right">
<view>进入任务<uni-icons type="right" color="#3175f9"></uni-icons></view>
</view>
</view>
2023-08-04 11:32:51 +08:00
</view>
</view>
</view>
</template>
<script>
import { Toast } from '../../libs/uniApi';
2023-08-04 11:32:51 +08:00
export default {
name: "task",
2023-08-05 19:07:46 +08:00
props: {
datas: {
type: Object,
2023-08-06 16:27:59 +08:00
default: function(){
return {}
}
2023-08-05 19:07:46 +08:00
}
},
2023-08-04 11:32:51 +08:00
data() {
return {
};
2023-08-05 19:07:46 +08:00
},
methods:{
2023-08-10 14:13:35 +08:00
navTo(url) {
2023-08-05 19:07:46 +08:00
url ?
uni.navigateTo({
url: url,
}) : Toast('暂未开放')
},
clickTask(){
2023-08-15 18:27:07 +08:00
// console.log('点击', this.$props.datas);
2023-08-16 15:53:56 +08:00
if((this.$props.datas.type!=31)&&this.$props.datas.status!==2&&this.$props.datas.status!==1){
2023-08-15 18:27:07 +08:00
return this.$props.datas.status==3?Toast('任务已完成!'):Toast('任务已结束!');
}
if(this.$props.datas.type==31){
// this.navTo('/subpkg/fileTask/fileTask?id=' + JSON.stringify(this.$props.datas?.extend?.informationg?.arr))
2023-08-16 15:53:56 +08:00
this.navTo(`/subpkg/archives/archives?task_id=${this.$props.datas?.id}`)
2023-08-10 14:13:35 +08:00
}else this.navTo('');
2023-08-05 19:07:46 +08:00
}
2023-08-04 11:32:51 +08:00
}
}
</script>
<style lang="scss">
.c_task_item {
margin: 0 auto;
margin-bottom: 28rpx;
width: 694rpx;
background: #FFFFFF;
border-radius: 14rpx 14rpx 14rpx 14rpx;
opacity: 1;
font-size: 25rpx;
font-weight: 400;
color: #999999;
line-height: 39rpx;
.text {
font-size: 28rpx;
font-weight: 400;
color: #333333;
line-height: 39rpx;
margin-left: 18rpx;
}
.top {
display: flex;
justify-content: space-between;
padding: 28rpx;
border-bottom: 1rpx solid #F5F5F5FF;
.left {
display: flex;
justify-content: left;
align-items: center;
}
.right {
.icon {
width: 43rpx;
height: 43rpx;
}
}
}
2023-08-05 11:11:27 +08:00
.bottom{
padding: 28rpx;
display: flex;
.b_left{
width: 103.39rpx;
height: 94.63rpx;
margin-right: 18rpx;
}
.b_right{
flex: 1;
display: flex;
justify-content: space-around;
flex-direction: column;
2023-08-04 11:32:51 +08:00
.item {
display: flex;
justify-content: space-between;
2023-08-05 11:11:27 +08:00
// margin: 18rpx 28rpx 0 28rpx;
// &:last-child {
// padding-bottom: 18rpx;
// }
2023-08-04 11:32:51 +08:00
.left {
display: flex;
}
.right{
font-size: 32rpx;
font-weight: 400;
color: #3274F9;
line-height: 39rpx;
.price{
font-size: 25rpx;
}
}
}
}
2023-08-05 11:11:27 +08:00
}
}
2023-08-04 11:32:51 +08:00
</style>