942 lines
32 KiB
Vue
942 lines
32 KiB
Vue
<template>
|
||
<view class="test-list-wrap" style="display:block;">
|
||
<view class="head-bar" :style="{'margin-top': barHeight + 5 + 'px'}">
|
||
<view class="go-back" @click="goback"></view>
|
||
<text>生涯测评</text>
|
||
</view>
|
||
<view class="contrast-box" >
|
||
<view class="desc">
|
||
<text class="icon"></text>
|
||
<view class="txt-item">
|
||
<text v-for="(item,index) in selectTypeStr" :key="index">{{item}}</text>
|
||
</view>
|
||
</view>
|
||
<view class="btn" @click="showContrastLayer">
|
||
筛选
|
||
</view>
|
||
</view>
|
||
<view class="content" style="overflow:hidden;">
|
||
<view class="p-item" v-for="(pitem,pindex) in filteredData" :key="pindex">
|
||
<view class="h1">{{pitem.title}}</view>
|
||
<view class="item" v-for="(item,index) in pitem.list" :key="index">
|
||
<view class="h2">{{item.TestName}}</view>
|
||
<view class="do-time">
|
||
约{{item.AvgTime == 0 ? '1' : item.AvgTime}}分钟
|
||
</view>
|
||
<view class="desc">
|
||
{{item.Brief}}
|
||
</view>
|
||
<view class="btn-wrap">
|
||
<view class="btn" v-if="item.HasTest" @click="navTest(item,1)">
|
||
重新测评
|
||
</view>
|
||
<view class="btn" v-else @click="navTest(item,1)">
|
||
开始测评
|
||
</view>
|
||
<view class="btn" v-if="item.HasTestRecordProcess && item.Type != 25" @click="navTest(item,2)">
|
||
继续测评
|
||
</view>
|
||
<view class="report-btn" v-if="item.HasTest" @click="navReport(item)">
|
||
查看报告
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 筛选 -->
|
||
<uni-popup ref="pop_card" type="bottom">
|
||
<view class="search-content">
|
||
<view class="head-title">
|
||
<text>筛选</text>
|
||
<view @click="closeDialog()" class="s_close"></view>
|
||
</view>
|
||
<view class="item-content">
|
||
<view class="title">测评等级</view>
|
||
<view class="options">
|
||
<view class="item" v-for="(item,index) in levelOption" :class="checkedTestLevel==item.value?'on':''" @click="checkedTestLevel = item.value" :key="index">{{item.name}}</view>
|
||
</view>
|
||
<view class="title">测评类型</view>
|
||
<view class="options">
|
||
<view class="item" v-for="(item,index) in typeOption" :class="checkedTestType==item.value?'on':''" @click="checkedTestType = item.value" :key="index">{{item.name}}</view>
|
||
</view>
|
||
<view class="title">测评功能</view>
|
||
<view class="options">
|
||
<view class="item" v-for="(item,index) in fnOption" :class="checkedTestFun==item.value?'on':''" @click="checkedTestFun = item.value" :key="index">{{item.name}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="btn-wrap">
|
||
<view class="btn" v-on:click="confirmCompute">
|
||
确认筛选
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import api from "@/apiCa/testManage.js"
|
||
export default {
|
||
data() {
|
||
return {
|
||
barHeight: wx.getWindowInfo().statusBarHeight,
|
||
refreshIfNeeded: false, //是否返回刷新
|
||
dataList: [],
|
||
selectTypeStr: ["全部"],
|
||
showContrast: false,//显示筛选
|
||
levelOption: [
|
||
{
|
||
name: "全部",
|
||
value: 0
|
||
},
|
||
{
|
||
name: "基础型",
|
||
value: 1
|
||
},
|
||
{
|
||
name: "进阶型",
|
||
value: 2
|
||
},
|
||
{
|
||
name: "专项型",
|
||
value: 3
|
||
},
|
||
],
|
||
typeOption: [
|
||
{
|
||
name: "全部",
|
||
value: 0
|
||
},
|
||
{
|
||
name: "生涯类",
|
||
value: 1
|
||
},
|
||
{
|
||
name: "学习力类",
|
||
value: 2
|
||
},
|
||
{
|
||
name: "心理健康类",
|
||
value: 3
|
||
},
|
||
{
|
||
name: "其他",
|
||
value: 4
|
||
},
|
||
],
|
||
fnOption: [
|
||
{
|
||
name: "全部",
|
||
value: 0
|
||
},
|
||
{
|
||
name: "情感态度",
|
||
value: 1
|
||
},
|
||
{
|
||
name: "智力能力",
|
||
value: 2
|
||
},
|
||
{
|
||
name: "认知学习",
|
||
value: 3
|
||
},
|
||
{
|
||
name: "人格特质",
|
||
value: 4
|
||
},
|
||
{
|
||
name: "心理健康",
|
||
value: 5
|
||
}
|
||
],
|
||
testLevel:0 ,// 测评等级
|
||
testType: 0,// 测评类型
|
||
testFun: 0,// 测评功能
|
||
checkedTestLevel: 0,// 测评等级
|
||
checkedTestType: 0,// 测评类型
|
||
checkedTestFun: 0,// 测评功能
|
||
testList1: [], //情感
|
||
testList2: [], //智力
|
||
testList3: [], //认知学习
|
||
testList4: [], //人格特质
|
||
testList5: [], //心理健康
|
||
testList6: [], //其他测评
|
||
filteredData: [],//筛选后数据
|
||
}
|
||
},
|
||
onShow() {
|
||
this.queryTaskListForWeChart();
|
||
},
|
||
methods: {
|
||
closeDialog(){
|
||
this.$refs.pop_card.close();
|
||
},
|
||
//确认筛选
|
||
confirmCompute(){
|
||
this.testLevel = this.checkedTestLevel;
|
||
this.testType = this.checkedTestType;
|
||
this.testFun = this.checkedTestFun;
|
||
if(this.checkedTestLevel == 0 && this.checkedTestType == 0 && this.checkedTestFun == 0){
|
||
this.selectTypeStr = ["全部"];
|
||
}else {
|
||
let arr = [];
|
||
if(this.checkedTestLevel != 0){
|
||
arr.push(this.levelOption[this.checkedTestLevel].name);
|
||
}
|
||
if(this.checkedTestType != 0){
|
||
arr.push(this.typeOption[this.checkedTestType].name);
|
||
}
|
||
if(this.checkedTestFun != 0){
|
||
arr.push(this.fnOption[this.checkedTestFun].name);
|
||
}
|
||
this.selectTypeStr = arr;
|
||
}
|
||
|
||
this.filteredData = this.dataList.map(category => {
|
||
const filteredList = category.list.filter(item => {
|
||
// 处理TestLevel筛选
|
||
const levelMatch = this.testLevel === 0 || item.TestLevel === this.testLevel;
|
||
|
||
// 处理TestType特殊映射（其他类对应TestType=0）
|
||
const typeMatch = this.testType === 0 ? true :
|
||
this.testType === 4 ? item.TestType === 0 :
|
||
item.TestType === this.testType;
|
||
|
||
// 处理TestFun筛选
|
||
const funMatch = this.testFun === 0 || item.TestFun === this.testFun;
|
||
|
||
return levelMatch && typeMatch && funMatch;
|
||
});
|
||
return { ...category, list: filteredList };
|
||
}).filter(category => category.list.length > 0); // 过滤空分组
|
||
//this.showContrast = false;
|
||
this.$refs.pop_card.close();
|
||
},
|
||
// 显示筛选列表
|
||
showContrastLayer(){
|
||
//this.showContrast = true;
|
||
this.$refs.pop_card.open('bottom') //底部弹出
|
||
this.checkedTestLevel = this.testLevel;
|
||
this.checkedTestType = this.testType;
|
||
this.checkedTestFun = this.testFun;
|
||
},
|
||
// 返回
|
||
goback(){
|
||
uni.navigateBack(-1);
|
||
},
|
||
//获取列表
|
||
queryTaskListForWeChart() {
|
||
uni.showLoading({
|
||
title: "加载中"
|
||
})
|
||
let eduLevel = uni.getStorageSync("CAuserInfo").user.GradeLevel;
|
||
new Promise((resolve,reject)=>{
|
||
return api.getTestTypeTagLIst().then((res)=>{
|
||
resolve(res)
|
||
})
|
||
}).then((res)=>{
|
||
let arr = [];
|
||
res.Data.forEach(item=>{
|
||
return arr.push(item.Type);
|
||
})
|
||
return api.getUserTestTypeProcessList(JSON.stringify(arr)).then((res1)=>{
|
||
return [res, res1];
|
||
})
|
||
}).then(([res1, res2]) => {
|
||
if (res1.Result === 1 && res2.Result === 1) {
|
||
return api.queryTaskListForWeChart(eduLevel).then((res) => {
|
||
return [res, res1, res2];
|
||
});
|
||
}
|
||
}).then(([res, res1, res2]) => {
|
||
uni.hideLoading();
|
||
if (res && res.Result === 1) {
|
||
this.testList1 = [];
|
||
this.testList2 = [];
|
||
this.testList3 = [];
|
||
this.testList4 = [];
|
||
this.testList5 = [];
|
||
this.testList6 = [];
|
||
let list = res.Data.TestList;
|
||
list.forEach(item=>{
|
||
// 处理答题记录匹配
|
||
item.HasTestRecordProcess = false;
|
||
res2.Data.forEach(ritem=>{
|
||
if(item.TestType == ritem.TestType){
|
||
item.HasTestRecordProcess = ritem.HasTestRecordProcess;
|
||
}
|
||
})
|
||
})
|
||
let num = 0;
|
||
let arr = [];
|
||
let arr1 = [];
|
||
list.forEach(item=>{
|
||
if(item.HasTest){
|
||
num++
|
||
}
|
||
let isMatch = false;
|
||
// 处理测评分类匹配
|
||
res1.Data.forEach((yitem, yindex) => {
|
||
if (item.TestType == yitem.Type) {
|
||
item.Type = item.TestType;
|
||
item.TestType = yitem.TestType;
|
||
item.TestLevel = yitem.TestLevel;
|
||
item.TestFun = yitem.TestFun;
|
||
arr.push(item);
|
||
isMatch = true;
|
||
}
|
||
})
|
||
if (!isMatch) {
|
||
item.Type = item.TestType;
|
||
item.TestType = 0;
|
||
item.TestLevel = 0;
|
||
item.TestFun = 0;
|
||
arr1.push(item);
|
||
}
|
||
})
|
||
this.testList6 = arr1;
|
||
this.testList = list;
|
||
arr.forEach((item, index) => {
|
||
switch (item.Type) {
|
||
// 1 情感态度
|
||
// 高中，大学职业兴趣11
|
||
// 工作价值观17
|
||
// 学习动机测评-33
|
||
// 自我效能感测评-34
|
||
// 小学兴趣测评-31
|
||
//初中兴趣测评18
|
||
case 11:
|
||
case 17:
|
||
// case 18:
|
||
// case -31:
|
||
// case -33:
|
||
// case -34:
|
||
{
|
||
this.testList1.push(item);
|
||
// this.interestList.push(item);
|
||
break;
|
||
}
|
||
// 2 智力能力
|
||
// 注意力22
|
||
// 记忆力23
|
||
// 多元智能16
|
||
// 小学多元智能 -32
|
||
// 多元性向潜能发展6
|
||
// 推理能力测评-45
|
||
// 批判性思维倾向测评-38
|
||
// 创造力倾向测评-37
|
||
// 多元(职业)能力测评-27
|
||
// 通用(职业)能力测评-28
|
||
// case 22:
|
||
// case 23:
|
||
// case 16:
|
||
// case 6:
|
||
// case -32:
|
||
// case -45:
|
||
// case -38:
|
||
// case -37:
|
||
case -27:
|
||
case -28: {
|
||
this.testList2.push(item);
|
||
break;
|
||
}
|
||
// 3认知学习
|
||
// 学科信心-2
|
||
// 学科能力测评20
|
||
// 学科自评-9999
|
||
// 学习习惯-36
|
||
// 领导力测评-29
|
||
// 生涯建构测评-42
|
||
// 生涯适应力测评-43
|
||
// 意志力测评 -35
|
||
// 场独立-场依存认知风格测评 25
|
||
// 沉思型-冲动型认知风格测评 26
|
||
// 儿童元认知测评 -39
|
||
// 元认知测评 -40
|
||
// 学习资源管理能力测评 -41
|
||
// 问题解决能力测评-44
|
||
// case -2:
|
||
// case 20:
|
||
// case -9999:
|
||
// case -36:
|
||
// case -29:
|
||
// case -42:
|
||
// case -43:
|
||
// case -35:
|
||
// case 25:
|
||
// case 26:
|
||
// case -39:
|
||
// case -40:
|
||
// case -41:
|
||
// case -44:
|
||
// {
|
||
// this.testList3.push(item);
|
||
// // this.workValueList.push(item);
|
||
// break;
|
||
// }
|
||
// 4.人格特质
|
||
// MBTI 4
|
||
// 人格测评15
|
||
// case 4:
|
||
case 15: {
|
||
this.testList4.push(item);
|
||
break;
|
||
}
|
||
// 5.心理健康
|
||
// SCL-90
|
||
// case -10: {
|
||
// this.testList5.push(item);
|
||
// break;
|
||
// }
|
||
}
|
||
})
|
||
let allList = [];
|
||
if(this.testList1.length>0){
|
||
allList.push({title: '情感态度', list: this.testList1});
|
||
}
|
||
if(this.testList2.length>0){
|
||
allList.push({title: '智力能力', list: this.testList2});
|
||
}
|
||
if(this.testList3.length>0){
|
||
allList.push({title: '认知学习', list: this.testList3});
|
||
}
|
||
if(this.testList4.length>0){
|
||
allList.push({title: '人格特质', list: this.testList4});
|
||
}
|
||
// if(this.testList5.length>0){
|
||
// allList.push({title: '心理健康', list: this.testList5});
|
||
// }
|
||
// if(this.testList6.length>0){
|
||
// allList.push({title: '其他测评', list: this.testList6});
|
||
// }
|
||
this.dataList = allList;
|
||
this.confirmCompute();
|
||
}
|
||
}).catch((error) => {
|
||
console.error('请求出错:', error);
|
||
});
|
||
},
|
||
routerUrl(TYPE){
|
||
switch (TYPE) {
|
||
case 11: {
|
||
// 高中兴趣测评
|
||
uni.navigateTo({
|
||
url: "/packageCa/pagesTest/interestTestTitle"
|
||
})
|
||
break;
|
||
}
|
||
case 15: {
|
||
// 人格测评
|
||
uni.navigateTo({
|
||
url: "/packageCa/pagesTest/personalTestTitle"
|
||
})
|
||
break;
|
||
}
|
||
case 17: {
|
||
// 工作价值观测评
|
||
uni.navigateTo({
|
||
url: "/packageCa/pagesTest/workValuesTestTitle"
|
||
})
|
||
break;
|
||
}
|
||
|
||
case -27: {
|
||
// 多元能力
|
||
uni.navigateTo({
|
||
url: "/packageCa/pagesTest/customTestTitle?testType=-27"
|
||
})
|
||
break;
|
||
}
|
||
case -28: {
|
||
// 通用职业
|
||
uni.navigateTo({
|
||
url: "/packageCa/pagesTest/customTestTitle?testType=-28"
|
||
})
|
||
break;
|
||
}
|
||
}
|
||
},
|
||
navTest(item,index) {
|
||
if(index == 1){
|
||
uni.showLoading({
|
||
title: "加载中..."
|
||
})
|
||
api.removeTestRecordProcess(item.Type).then((res) => {
|
||
if (res.Result == 1) {
|
||
uni.hideLoading();
|
||
this.routerUrl(item.Type)
|
||
}
|
||
})
|
||
}else {
|
||
this.routerUrl(item.Type)
|
||
}
|
||
},
|
||
navReport(item) {
|
||
switch (item.Type) {
|
||
case 11: {
|
||
// 兴趣测评
|
||
uni.navigateTo({
|
||
url: `/packageCa/testReport/interestTestReport`
|
||
})
|
||
break;
|
||
}
|
||
case 15: {
|
||
// 人格测评
|
||
uni.navigateTo({
|
||
url: `/packageCa/testReport/personalTestReport`
|
||
})
|
||
break;
|
||
}
|
||
case 17: {
|
||
// 工作价值观测评
|
||
uni.navigateTo({
|
||
url: `/packageCa/testReport/workValuesTestReport`
|
||
})
|
||
break;
|
||
}
|
||
case -27: {
|
||
// 多元能力
|
||
uni.navigateTo({
|
||
url: `/packageCa/testReport/multipleAbilityTestReport?id=${item.RecordId}`
|
||
})
|
||
break;
|
||
}
|
||
case -28: {
|
||
// 通用职业
|
||
uni.navigateTo({
|
||
url: `/packageCa/testReport/generalCareerTestReport?id=${item.RecordId}`
|
||
})
|
||
break;
|
||
}
|
||
}
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
<style lang="scss">
|
||
$image-oss-url: "https://51xuanxiao.oss-cn-hangzhou.aliyuncs.com/Resource/xcx_sygh";
|
||
page {
|
||
background: url('#{$image-oss-url}/18.png') no-repeat;
|
||
background-size: contain;
|
||
overflow-y:scroll;
|
||
background-color:#f5f5f5;
|
||
}
|
||
</style>
|
||
<style lang="scss" scoped>
|
||
.head-bar {
|
||
position: relative;
|
||
text-align: center;
|
||
font-size: 36rpx;
|
||
font-weight: 600;
|
||
height: 60rpx;
|
||
line-height: 60rpx;
|
||
margin-bottom: 40rpx;
|
||
.go-back {
|
||
position: absolute;
|
||
left: 10rpx;
|
||
top: 0;
|
||
width: 60rpx;
|
||
height: 60rpx;
|
||
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAABUklEQVRoQ+3ZOwrCQBCA4UlyCVsrQauQdPYewcNYWXoHK1s9gYeYdIKlracYWYggkgiTnccuaB3D/+1sYEMKyPxXZN4Pf0DMBOu6XpZluQOANRGduq7bc+/nNoE+/gwAq3c0IrJ72H/grtDQ9UPxAPBAxDn3/uaAkfjQvUXES9IA6fiANZuARrwZQCveBKAZrw7QjlcFWMSrAaziVQCW8eIA63hRgEe8GMArXgTgGR8N8I6PAqQQPxmQSvxkQNM0VwDYfJ3dJ53nuef/7+vZx+l+9W8pxE+aQNu2CyK6ZwsI4VlvoQDI/iFOCcF+iD/3fgqTiAKkMIlogDdCBOCJEAN4IUQBHghxgDVCBWCJUANYIVQBFgh1gDbCBKCJMANoIUwBGghzwA/EExFn3HdkF8AYIpvPrO9VDu8TVVUdiKghomNWH7q5W2Xserct9Af0K/AChQ/cMY9OGScAAAAASUVORK5CYII=") center no-repeat;
|
||
background-size: 38rpx 38rpx;
|
||
}
|
||
}
|
||
.progress-box {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-bottom: 36rpx;
|
||
.progress-txt {
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 24rpx;
|
||
width: 175rpx;
|
||
color: #333333;
|
||
margin-right: 20rpx;
|
||
.strong {
|
||
font-size: 32rpx;
|
||
color: #20B664;
|
||
font-weight: 600;
|
||
margin-left: 6rpx;
|
||
}
|
||
}
|
||
.progress-bar {
|
||
width: 500rpx;
|
||
height: 24rpx;
|
||
background: #F8F8F8;
|
||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||
.progress {
|
||
position: relative;
|
||
background-image: repeating-linear-gradient(-45deg, #20B664, #20B664 20rpx, #47C580 20rpx, #47C580 30rpx);
|
||
height: 24rpx;
|
||
border-radius: 20rpx;
|
||
transition: width 1s ease-in-out;
|
||
&::after {
|
||
display: block;
|
||
content: "";
|
||
position: absolute;
|
||
right: -20rpx;
|
||
top: -8rpx;
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAsCAMAAAApWqozAAAA2FBMVEUAAAA60X84z4A60YE50X850n860H860IA6z4A4z4A60X850IA50X84z4Awz4D///860X8iv2khu2ciwmskyW8guWUlzHEky3Ajx20hvWglznEl0HMm0nQjxWwm1HUgt2Q3z3zk+O112KK67dGR47Yu03kyznktzXYuyHQz0nsvxXIqwm/I8NoqyHInv2ys6Mc9yHwr0Xbx+/Wt7Mpa15NZ0ZBO1os/0IEyynfI8tyD3Ktn1Jjx/PbW8+Of5b6E4q9LzYZA1oVLyYTW9eSf6cGf5r+C2qpp35/QM//cAAAAD3RSTlMA70B/37+vn2Agz7+PYBCLRPBlAAACh0lEQVQ4y6XV2XqqMBAAYKKI1i2DgNZWK6AHEHetS7X72d7/jc4kGBJFvTlzARf833yTySRo55HLV8oEgOhGNVdXP2RlEZ0MUsxdpSUdgRuEi8fHx05nMRwCQOEyvzNQhs1m8wGD887TD8bvLqQlSFutVhNDasZJ7dzmAYKmbaPmWOonLCafseG9jZHJjcmFlnZyf6/oh+u6hraL+EbuUtoHAlG3i/pGbiJ6UoDAsjIa+dfz36/hcZVGYnMAlpXVmxVl8ZLkFoUUILIyetunSXii37pMfKY3HhVxrBsgh7gIkWmmejsbD2zbp2l46c4XNa1OwDRTPeDf+XP18cJe/WNPFkBYFYEp9HwsMw5areAV379EB4dYRxWi9lH7HpXxjKv8ie+N6PcQt9GAUTvRPlVjZdtb1rl0LxdQ0XQw24nu05MYsz6/btK9XEBZI9BuNLieUbr0lvQkPuScdHCFAA3ETMf+Ghd5kn+gzgkAw1yLVc5Uq84gwwSxqt8VvLW5FphoZZg6nDM9f5vPFdxXZhCxrlUQOyL3mI7NwUmzZe4QDDxRsSP0H/zum/ulLFqZ7wCquN07R+j4e0aXezNeH2bHzMp8u7jdbIVcc+6h8D4ta83tb/U0AKmzER31hPZpf8wqsT6Z9aKu1CEU+fC7PaG//fbBm2MH9wyv1bPDhh9Dx9RpbmVO3tWzE0IhueXAbUiNPMFvJyeNJeZhQNQ7yx0ffKRSB1CQl8zoXGMoOpSXDBYC01t6AlBTL0ZXaoxTPclco9criaSVeudc0t2dsErUCLgjJ6MnLpDShR9QAcCNHbVuCykYd5f/gshhF0/bjE5HUQAAeun/fpoy6rmqoRN05Uo+I/8B7R+IPTrIPJ8AAAAASUVORK5CYII=');
|
||
background-size: 100%;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.test-list-wrap {
|
||
padding: 0 20rpx 130rpx;
|
||
|
||
.content {
|
||
.p-item {
|
||
.h1 {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-bottom: 24rpx;
|
||
font-weight: 600;
|
||
font-size: 28rpx;
|
||
color: #333333;
|
||
&:before {
|
||
content: "";
|
||
display: block;
|
||
width: 8rpx;
|
||
height: 28rpx;
|
||
margin-right: 6rpx;
|
||
background: #1677ff;
|
||
border-radius: 4rpx 4rpx 4rpx 4rpx;
|
||
}
|
||
}
|
||
}
|
||
.item {
|
||
position: relative;
|
||
padding: 40rpx 20rpx;
|
||
background: #fff;
|
||
height: 224rpx;
|
||
border-radius: 12rpx;
|
||
margin-bottom: 25rpx;
|
||
/*background: #F2F9FF;*/
|
||
background:#fff;
|
||
// border: 2rpx solid #E7F4FD;
|
||
border: 2rpx solid #fff;
|
||
overflow: hidden;
|
||
|
||
&:nth-child(2n-1) {
|
||
&::after {
|
||
content: "";
|
||
position: absolute;
|
||
right: -110rpx;
|
||
bottom: -60rpx;
|
||
display: block;
|
||
width: 118rpx;
|
||
height: 118rpx;
|
||
border-radius: 50%;
|
||
border: 34rpx solid rgba(189, 226, 255, 0.5);
|
||
}
|
||
|
||
&::before {
|
||
content: "";
|
||
position: absolute;
|
||
right: 55rpx;
|
||
bottom: 106rpx;
|
||
display: block;
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
border-radius: 50%;
|
||
background: rgba(189, 226, 255, 0.5);
|
||
}
|
||
}
|
||
|
||
&:nth-child(2n) {
|
||
/*background: #F7F7FF;*/
|
||
background: #fff;
|
||
border: 2rpx solid #FFF;
|
||
|
||
&::before {
|
||
content: "";
|
||
position: absolute;
|
||
right: -65rpx;
|
||
bottom: 75rpx;
|
||
display: block;
|
||
width: 102rpx;
|
||
height: 102rpx;
|
||
border-radius: 24rpx;
|
||
transform: rotateZ(45deg) skew(-20deg, -20deg);
|
||
background: rgba(205, 217, 255, 0.4);
|
||
z-index: 9;
|
||
}
|
||
|
||
&::after {
|
||
content: "";
|
||
position: absolute;
|
||
right: -72rpx;
|
||
bottom: 10rpx;
|
||
display: block;
|
||
width: 128rpx;
|
||
height: 128rpx;
|
||
border-radius: 33rpx;
|
||
transform: rotateZ(45deg) skew(-20deg, -20deg);
|
||
background: rgba(205, 217, 255, 0.2);
|
||
// background: #3F51B5;
|
||
}
|
||
}
|
||
|
||
.h2 {
|
||
font-size: 36rpx;
|
||
color: #333;
|
||
margin-bottom: 20rpx;
|
||
}
|
||
|
||
.do-time {
|
||
position: absolute;
|
||
right: 20rpx;
|
||
top: 40rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 24rpx;
|
||
color: #20B664;
|
||
|
||
&:before {
|
||
content: "";
|
||
display: block;
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
margin-right: 10rpx;
|
||
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAIASURBVEiJ3ZaxctNAEIa/tQ5oU1Ieb5A3wJlUNsPEGR4gChE18Qy9cc+MQ6+AeIAMYZjYFRPzBrwBV6Z0yRDZS3GykayTYTyh4a+ku93/313d3koowU5iC4Cah2wDyW8AXCdzq6UV+Tg5BUZbEdfRd930DKB1R4SNkPKLncRWMfuipACodhCZbWRQ3UFkAqDwSiS/CJaoLIKa74X3oeueX27it5+TNhHXni1/VCaHQIkKg2+F/MHG6AGilc10nRzANLhNgV2UNixPVzSomsyH/GCGEiOAMA0RhQUkf4uaUxBrr57HII9Rias2EdzXrwg7fiH/EKRqyAA7fvERtAfqkPleMAONrkEsMHXddO/vMwCQ2z5qep7AHLlOelwNIBkB1msxbKRpFADsJBmgvPaWmi0WrYuWiEHmB6WSnblu2t9KAMBenbxH1uq/hGrmnpwfB/cK/PNO3ihgx8loFb1oBnq4UHnqnwGR2E6SQSMBm05RuUMDda5+n3oH/zmDiCIydaGP6DrpENST6r3GWzgoUMyFtnfWxiP4e097q1myhoY+MEfejxk/F5dNzq7zLrPjkwGIRc1LoJZpWKC4gxAyHpgYDQ8iO076iE5RYpYZr6FWokp55nwKBlANZmmzG8q0PnDUPBN4452LgSNac/T74ioDR0iE/Mt/PpOBO/1t+QUcj9NlQhj6vwAAAABJRU5ErkJggg==") no-repeat;
|
||
background-size: 100%;
|
||
}
|
||
}
|
||
|
||
.desc {
|
||
font-size: 26rpx;
|
||
color: #666666;
|
||
}
|
||
|
||
.btn-wrap {
|
||
position: absolute;
|
||
bottom: 40rpx;
|
||
left: 20rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.btn {
|
||
width: 200rpx;
|
||
height: 64rpx;
|
||
line-height: 64rpx;
|
||
background: #1677ff;
|
||
margin-right: 20rpx;
|
||
color: #fff;
|
||
font-size: 28rpx;
|
||
text-align: center;
|
||
border-radius: 60rpx;
|
||
}
|
||
|
||
.report-btn {
|
||
width: 200rpx;
|
||
height: 64rpx;
|
||
line-height: 64rpx;
|
||
text-align: center;
|
||
border-radius: 60rpx;
|
||
border: 2rpx solid #1677ff;
|
||
font-size: 28rpx;
|
||
color: #1677ff;
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
}
|
||
.contrast-box {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
width: 666rpx;
|
||
height: 76rpx;
|
||
margin-bottom: 20rpx;
|
||
padding: 0 20rpx;
|
||
background: #E7F1FF;
|
||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||
border: 2rpx solid #FFFFFF;
|
||
|
||
.desc {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.icon {
|
||
width: 28rpx;
|
||
height: 28rpx;
|
||
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAHfSURBVEiJ1Va9btswEP5OlBNr01JAMgpUeYNm7FDAeoP2Ddq1UzK5Roc6Q6AoS7auzps4QDt0i4fu1lYVWThFP7Z4HSIpspC4cCMmyLeQR+nu4/GOvAOeAwYn+dQ9zWf/o0vtBSdIvE0KBpkvmfg7AKyY3i5T85eckLzRZS/NICvZnrBdze8kdMN8AWAj4V1gVfgkxFcwhqX8EcAFGeISYPl7tLtXb7jl2dZkJTww7FoyzFelLRsgzwm4tmu0NbcBMz6tVtiPx9Z5kvR8VoXPqvDjUe+oUKI+yjRDPa+P1AkSjwyx2IZQAW/+jHZ+3vd9EGbvlFIyHlsX1dqDPPznhpSSTU+1EjpBMiRDzEwTM3vCdXy1eljC7u/eJpSpiyXN+nPLyiMAiMcUaSeUE5IS2Guvaz1SN1yeuWF+9iiETpAMAT4AcNDZxd+E+y6+NsKrLztzYpwD6rD5gGtLGgC4TnuH7WqhM4aeZS0XbpitPZc6s9RD19ViE54macDvWRV+M47Pq1oQY7/qgZwg8ZwgGb44zl+XcvfVggjfSIgpAJAQ05Lg0gmSD43f1qpFTRiPrQhAtDWputGpxgpp1p8DHAEcNavFg9vEq8+9H7e6621iZ3BP89ngJJ92alQX/gLMKt2XTOFMygAAAABJRU5ErkJggg==") no-repeat;
|
||
background-size: 100%;
|
||
}
|
||
|
||
.txt-item {
|
||
width: 400rpx;
|
||
line-height: 21px;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
margin-left: 20rpx;
|
||
text {
|
||
|
||
display: inline-block;
|
||
line-height: 50rpx;
|
||
font-size: 24rpx;
|
||
color: #1677ff;
|
||
margin-left: 16rpx;
|
||
|
||
&::after {
|
||
content: "";
|
||
display: inline-block;
|
||
width: 2rpx;
|
||
height: 12rpx;
|
||
margin-left: 16rpx;
|
||
background: #1677ff;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.btn {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 120rpx;
|
||
height: 48rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||
font-size: 24rpx;
|
||
color: #333333;
|
||
|
||
&::after {
|
||
content: "";
|
||
display: block;
|
||
width: 0;
|
||
height: 0;
|
||
margin-left: 6rpx;
|
||
border-top: 12rpx solid #333;
|
||
border-left: 12rpx solid #fff;
|
||
border-right: 12rpx solid #fff;
|
||
}
|
||
}
|
||
}
|
||
.search-content {
|
||
width: 100%;
|
||
background: #fff;
|
||
border-top-left-radius: 28rpx;
|
||
border-top-right-radius: 28rpx;
|
||
overflow: hidden;
|
||
|
||
.head-title {
|
||
width: 100%;
|
||
height: 96rpx;
|
||
line-height: 96rpx;
|
||
text-align: center;
|
||
font-size: 36rpx;
|
||
color: #333;
|
||
font-weight:550;
|
||
margin-top:10rpx;
|
||
position:relative;
|
||
}
|
||
|
||
.item-content {
|
||
padding: 0 0 0 30rpx;
|
||
|
||
.s-line {
|
||
position: relative;
|
||
width: 630rpx;
|
||
margin: 15rpx auto 45rpx;
|
||
height: 2rpx;
|
||
background: #FAFAFA;
|
||
|
||
&:before {
|
||
content: "";
|
||
display: block;
|
||
position: absolute;
|
||
left: -85rpx;
|
||
top: -16rpx;
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
border-radius: 50%;
|
||
background: #EEF1F8;
|
||
}
|
||
|
||
&::after {
|
||
content: "";
|
||
display: block;
|
||
position: absolute;
|
||
right: -58rpx;
|
||
top: -16rpx;
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
border-radius: 50%;
|
||
background: #EEF1F8;
|
||
}
|
||
}
|
||
|
||
.title {
|
||
font-size: 28rpx;
|
||
color: #333333;
|
||
padding: 30rpx 0 20rpx;
|
||
}
|
||
|
||
.options {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
|
||
.v-line {
|
||
border-bottom: 1px dotted #f1ececb8;
|
||
margin: 26rpx 0;
|
||
}
|
||
|
||
.item {
|
||
position: relative;
|
||
min-width: 170rpx;
|
||
margin-right: 30rpx;
|
||
height: 76rpx;
|
||
text-align: center;
|
||
line-height: 76rpx;
|
||
background: #F5F5F5;
|
||
margin-bottom: 30rpx;
|
||
padding: 0 20rpx;
|
||
border-radius: 12rpx;
|
||
font-size: 28rpx;
|
||
color: #333333;
|
||
|
||
&.disable {
|
||
color: #C6C6C6;
|
||
background: #F8F8F8;
|
||
}
|
||
|
||
&.on {
|
||
background: #E7F1FF;
|
||
color: #1677ff;
|
||
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.btn-wrap {
|
||
display: flex;
|
||
justify-content: center;
|
||
padding-top: 10rpx;
|
||
padding-bottom: 40rpx;
|
||
|
||
.btn {
|
||
width: 688rpx;
|
||
height: 88rpx;
|
||
line-height: 88rpx;
|
||
text-align: center;
|
||
background: #1677ff;
|
||
font-size: 32rpx;
|
||
color: #fff;
|
||
border-radius: 60rpx;
|
||
}
|
||
}
|
||
}
|
||
.s_close{position:absolute;top:30rpx;right:6%;width:30rpx;height:30rpx;
|
||
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAgCAYAAAAFQMh/AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RjkzQkY4QkFCMjY0MTFGMDlGOThGMzcyM0VCRTJGMkYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RjkzQkY4QkJCMjY0MTFGMDlGOThGMzcyM0VCRTJGMkYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpGOTNCRjhCOEIyNjQxMUYwOUY5OEYzNzIzRUJFMkYyRiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpGOTNCRjhCOUIyNjQxMUYwOUY5OEYzNzIzRUJFMkYyRiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PvssjGYAAAO/SURBVHjatJf7a5V1HMef5bN2tduObjp1hMlOTbCpaKTifpI0b1EKXgo0U4Lw/0j8ZSoohkpFKjLvUYrWREX8Qa0oQaw5O7Yzt45jbW7u4nZ8f+R14MvDOdtz9PSB13jOs+37/n6u3+/Ji0aj2zzPaxenxF9i2Mu9lYo66BG/+foxT3SLAXFUtORY9AUxWywTM0WvKDHhWlEkqsSgaBD/5kj0Rdb/VKzms0U34bMjs6jYIvLFd+JBDoTfYc1FiJr9IS6PiUQiteTgZVEhyghHC/l41vDOFRvEKtbuE1fEAXHehBOEOErIJxL2TnFH9GcpmifeFl8gWsJ7E90lfhRtJhzXQ5xqnuR4Pk4kRbN4lIXwfLFZvC9e5d1ZPD2DQ0kTHtLDfUJbgrcW+smiXHSJfwj/SJZPIW0U68QrTni/EqdZ66mZcOrZiumuvRNviUIxXkwl17dpuUw2S2wVK4ia2UWxQ5yjZb10whbWBK2U74S9nJANsrG+NKJzaJkPxGuO6H7xfVA0KJyyNhEjVNWiQEwRlfRgM5tIVe+btMzH4iVhqftV7BQnMnVGOmEPgTjP1YS9HPFOejH1O6velY6nl8Qe8YOb06D5I+TsBq1hLbaENnuXdHSQ7/lMpAieXhffiOPpwhtW2CNk9fSyDYNixMsI9wREk4jWZ8pp2FC7BdcO3bRZFUyh1xOIfU2f/hem2f2QQ+EavV5BXoucGR/nYGnIdqaGtQHyGLRhp8pD22ihTtkMsUYsZKLlBTafz6ZaRxkyoUNti74h1lNcZeSwiYKz0L/O7ycz9c6FOdVG83i6+Fx8SAWn+nQ7g7+HaBTSbjbtHoo/M6QllMc1TKPVDA+zX8QhcZLPCTa0lApfyEk2gOdd2Xo8jTG4gQXNbjLwjzvz2oTvkYIaUlOF5/c5z4fCCtsCm8RH5NBjOOxDNBHo81YmWQH1UIhwhN5Pe3MNCk+lUDaSsyS7tlPmIIMknf2NeITQF7NWKf/TFqx2PxDez2ib8by7JXaHvHleZaN2YVhLy9WhUciVZ8D1eAzh/YRCqnIK6VtxmHCOZkN43uWEeyztVsKGYqlh43MbXMpBnvK0idl7aITwZrKfKT5bezHjdTmbsd6/YJVvHn/JH1Q69969hLfVy96SVHQ7ua4h7BVgvd/lc0cqdnJ6BJ7nq4zlspFRauFewDXqPSo84n6TiHEFfV5R9/BoJPePcTCPm2ivz2Fv0+YncYwLXa6snxFbRE9Pp8jiPvfeDg7x2P/wFbWPVitAx3L8+xMBBgBa0QNtbOSplwAAAABJRU5ErkJggg==") center no-repeat;
|
||
background-size:30rpx;
|
||
}
|
||
</style> |