|
|
@@ -1,32 +1,58 @@
|
|
|
<template>
|
|
|
<view class="qbox adffc">
|
|
|
- <div class="list" v-if="list.length">
|
|
|
+ <view class="list" v-if="list.length">
|
|
|
<up-list @scrolltolower="scrolltolower" style="height: 100%;">
|
|
|
<up-list-item class="list-item" v-for="(item, index) in list" :key="index">
|
|
|
- <image class="expand" :src="imgBase+'questionnaire_icon_down.png'"></image>
|
|
|
- <div class="title">{{item.title||''}}</div>
|
|
|
- <div class="name">团队名称：{{item.teamName||''}}</div>
|
|
|
- <div class="progress adfacjb">
|
|
|
- <div class="progress-left adfac">
|
|
|
- <div class="progress-left-text">作答进度：</div>
|
|
|
- <div class="progress-left-box">
|
|
|
- <div class="progress-left-box-current" :style="{'width':(item.yzdNum/item.sum*100)+'%'}"></div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="progress-right"><span>{{item.yzdNum}}/</span>{{item.sum}}</div>
|
|
|
- </div>
|
|
|
- <div class="bottom adfacjb">
|
|
|
- <div class="bottom-left">截止时间：{{item.endTime}}</div>
|
|
|
- <div class="bottom-right" v-if="item.status===0">立即作答</div>
|
|
|
- <div class="bottom-right" v-else-if="item.status===1">生成报告</div>
|
|
|
- <div class="bottom-right" v-else-if="item.status===2">发送报告</div>
|
|
|
- </div>
|
|
|
+ <view @click.prevent="showDialog(item)">
|
|
|
+ <image class="expand" :src="imgBase+'questionnaire_icon_down.png'"></image>
|
|
|
+ <view class="title">{{item.title||''}}</view>
|
|
|
+ <view class="name">团队名称：{{item.teamName||''}}</view>
|
|
|
+ <view class="progress adfacjb">
|
|
|
+ <view class="progress-left adfac">
|
|
|
+ <view class="progress-left-text">作答进度：</view>
|
|
|
+ <view class="progress-left-box">
|
|
|
+ <view class="progress-left-box-current" :style="{'width':(item.yzdNum/item.sum*100)+'%'}"></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="progress-right"><span>{{item.yzdNum}}/</span>{{item.sum}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="bottom adfacjb">
|
|
|
+ <view class="bottom-left">截止时间：{{item.endTime}}</view>
|
|
|
+ <view class="bottom-right" v-if="item.status===0">立即作答</view>
|
|
|
+ <view class="bottom-right" v-else-if="item.status===1">生成报告</view>
|
|
|
+ <view class="bottom-right" v-else-if="item.status===2">发送报告</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</up-list-item>
|
|
|
</up-list>
|
|
|
- </div>
|
|
|
- <div class="empty" v-else>
|
|
|
+ </view>
|
|
|
+ <view class="empty" v-else>
|
|
|
<page-empty></page-empty>
|
|
|
- </div>
|
|
|
+ </view>
|
|
|
+ <view class="dialog adffc" v-if="show">
|
|
|
+ <view class="dbox">
|
|
|
+ <view class="dbox-top adfacjb">
|
|
|
+ <view class="dbox-top-title">{{dto.title||''}}</view>
|
|
|
+ <image class="dbox-top-expand" :src="imgBase+'questionnaire_icon_down.png'" @click="show=false"></image>
|
|
|
+ </view>
|
|
|
+ <view class="dbox-name">团队名称：{{dto.teamName||''}}</view>
|
|
|
+ <view class="dbox-progress adfacjb">
|
|
|
+ <view class="dbox-progress-left adfac">
|
|
|
+ <view class="dbox-progress-left-text">作答进度：</view>
|
|
|
+ <view class="dbox-progress-left-box">
|
|
|
+ <view class="dbox-progress-left-box-current" :style="{'width':(dto.yzdNum/dto.sum*100)+'%'}"></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="dbox-progress-right"><span>{{dto.yzdNum}}/</span>{{dto.sum}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="dbox-menu">
|
|
|
+ <view class="dbox-menu-pre adffcac" v-for="(item,index) in menuList" :key="index">
|
|
|
+ <image :src="item.img"></image>
|
|
|
+ <text>{{item.text}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
@@ -42,12 +68,47 @@
|
|
|
},
|
|
|
data(){
|
|
|
return {
|
|
|
-
|
|
|
+ show:false,
|
|
|
+ dto:null,
|
|
|
+ menuList:[
|
|
|
+ {
|
|
|
+ img:this.$imgBase+'questionnaire_edit.png',
|
|
|
+ text:'编辑问卷'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img:this.$imgBase+'questionnaire_share.png',
|
|
|
+ text:'分享问卷'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img:this.$imgBase+'questionnaire_info.png',
|
|
|
+ text:'团队信息'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img:this.$imgBase+'questionnaire_copy.png',
|
|
|
+ text:'复制链接'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img:this.$imgBase+'questionnaire_users.png',
|
|
|
+ text:'团队人员'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img:this.$imgBase+'questionnaire_report.png',
|
|
|
+ text:'生成报告'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img:this.$imgBase+'questionnaire_report.png',
|
|
|
+ text:'发送报告'
|
|
|
+ }
|
|
|
+ ]
|
|
|
}
|
|
|
},
|
|
|
methods:{
|
|
|
scrolltolower(){
|
|
|
this.$emit('scrolltolower')
|
|
|
+ },
|
|
|
+ showDialog(item){
|
|
|
+ this.dto = item;
|
|
|
+ this.show = true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -167,5 +228,118 @@
|
|
|
.empty{
|
|
|
flex: 1;
|
|
|
}
|
|
|
+
|
|
|
+ .dialog{
|
|
|
+ position: fixed;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ bottom: 0;
|
|
|
+ background: rgba(0, 0, 0, .4);
|
|
|
+ z-index: 1001;
|
|
|
+ justify-content: flex-end;
|
|
|
+
|
|
|
+ .dbox{
|
|
|
+ width: 100%;
|
|
|
+ height: 738rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ box-shadow: 0rpx -2rpx 6rpx 0rpx rgba(0,0,0,0.07);
|
|
|
+ border-radius: 24rpx 24rpx 0rpx 0rpx;
|
|
|
+ padding: 48rpx 30rpx 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+ &-top{
|
|
|
+ &-title{
|
|
|
+ width: calc(100% - 60rpx);
|
|
|
+ font-family: PingFang-SC, PingFang-SC;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #002846;
|
|
|
+ line-height: 40rpx;
|
|
|
+ }
|
|
|
+ &-expand{
|
|
|
+ width: 32rpx;
|
|
|
+ height: 32rpx;
|
|
|
+ transform: rotate(180deg);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &-name{
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #667E90;
|
|
|
+ line-height: 24rpx;
|
|
|
+ margin-top: 24rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ &-progress{
|
|
|
+ margin-top: 36rpx;
|
|
|
+ &-left{
|
|
|
+ width: calc(100% - 95rpx);
|
|
|
+ &-text{
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #667E90;
|
|
|
+ line-height: 24rpx;
|
|
|
+ }
|
|
|
+ &-box{
|
|
|
+ flex: 1;
|
|
|
+ position: relative;
|
|
|
+ height: 12rpx;
|
|
|
+ background: #F0F2F8;
|
|
|
+ border-radius: 6rpx;
|
|
|
+ &-current{
|
|
|
+ height: 12rpx;
|
|
|
+ background: #7CC5C5;
|
|
|
+ border-radius: 6rpx;
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &-right{
|
|
|
+ font-size: 24rpx;
|
|
|
+ line-height: 24rpx;
|
|
|
+ color: #95A5B1;
|
|
|
+ span{
|
|
|
+ font-size: 24rpx;
|
|
|
+ line-height: 24rpx;
|
|
|
+ color: #002846;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &-menu{
|
|
|
+ margin-top: 43rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-left: -30rpx;
|
|
|
+ &-pre{
|
|
|
+ width: calc(25% - 30rpx);
|
|
|
+ background: #F7F8FA;
|
|
|
+ border-radius: 24rpx;
|
|
|
+ padding: 30rpx 20rpx;
|
|
|
+ margin-top: 24rpx;
|
|
|
+ margin-left: 30rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ float: left;
|
|
|
+ image{
|
|
|
+ width: 42rpx;
|
|
|
+ height: 42rpx;
|
|
|
+ }
|
|
|
+ text{
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #002846;
|
|
|
+ line-height: 24rpx;
|
|
|
+ text-align: center;
|
|
|
+ margin-top: 24rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|
