|
|
@ -10,9 +10,21 @@ |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view > |
|
|
|
<up-swiper :list="list3" previousMargin="30" nextMargin="30" circular :autoplay="false" radius="10" height="300rpx" |
|
|
|
@change="swiperChange"></up-swiper> |
|
|
|
<view> |
|
|
|
<up-swiper |
|
|
|
:list="level_list" |
|
|
|
previousMargin="10" |
|
|
|
nextMargin="10" |
|
|
|
circular |
|
|
|
:autoplay="false" |
|
|
|
radius="10" |
|
|
|
height="440rpx" |
|
|
|
keyName="paramValueImage" |
|
|
|
img-mode="aspectFit" |
|
|
|
:current="currentIndex" |
|
|
|
@change="swiperChange"></up-swiper> |
|
|
|
|
|
|
|
<!-- <image src="" mode="aspectFit"></image> --> |
|
|
|
</view> |
|
|
|
</template> |
|
|
|
|
|
|
@ -20,7 +32,9 @@ |
|
|
|
import cardTitle from '../../components/cardTitle.vue' |
|
|
|
import { |
|
|
|
ref, |
|
|
|
reactive |
|
|
|
reactive, |
|
|
|
onMounted, |
|
|
|
computed, |
|
|
|
} from "vue" |
|
|
|
|
|
|
|
|
|
|
@ -32,50 +46,110 @@ |
|
|
|
} |
|
|
|
}) |
|
|
|
|
|
|
|
let currentIndex = ref(0) |
|
|
|
|
|
|
|
const level_list = computed(() => { |
|
|
|
return props.dataInfo.level_list |
|
|
|
}) |
|
|
|
|
|
|
|
const cardName = ref("距离下一等级要求") |
|
|
|
const baseList = ref([ |
|
|
|
{ |
|
|
|
title: '仍需至少注册', |
|
|
|
num: "20人" |
|
|
|
}, |
|
|
|
// { |
|
|
|
// title: '仍需至少注册', |
|
|
|
// num: "20人" |
|
|
|
// }, |
|
|
|
]); |
|
|
|
|
|
|
|
const list3 = reactive([ |
|
|
|
'/static/images/levelImage/1.jpeg', |
|
|
|
'/static/images/levelImage/2.jpg', |
|
|
|
]); |
|
|
|
|
|
|
|
|
|
|
|
onMounted(() => { |
|
|
|
currentIndex.value = props.dataInfo.info.userHhRole |
|
|
|
swiperChange({ |
|
|
|
current : props.dataInfo.info.userHhRole, |
|
|
|
}) |
|
|
|
}) |
|
|
|
|
|
|
|
const swiperChange = (index) => { |
|
|
|
switch (index.current) { |
|
|
|
case 0: |
|
|
|
baseList.value = [{ |
|
|
|
title: '仍需至少注册', |
|
|
|
num: "20人" |
|
|
|
}] |
|
|
|
break; |
|
|
|
case 1: |
|
|
|
baseList.value = [{ |
|
|
|
title: '仍需至少注册', |
|
|
|
num: "20人" |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '或', |
|
|
|
num: " " |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '仍需至少下单', |
|
|
|
num: "5人" |
|
|
|
} |
|
|
|
] |
|
|
|
break; |
|
|
|
case 2: |
|
|
|
break; |
|
|
|
case 3: |
|
|
|
break; |
|
|
|
case 4: |
|
|
|
break; |
|
|
|
if(!props.dataInfo || !props.dataInfo.level_list) return |
|
|
|
|
|
|
|
let current = index.current + 1 |
|
|
|
|
|
|
|
if(!props.dataInfo.level_list[current]){ |
|
|
|
// if(index.current == (props.dataInfo.level_list.length - 1)){ |
|
|
|
baseList.value = [{ |
|
|
|
title: '已达到最高等级', |
|
|
|
num: "" |
|
|
|
}] |
|
|
|
return |
|
|
|
} |
|
|
|
|
|
|
|
let level = props.dataInfo.level_list[current] |
|
|
|
let info = props.dataInfo.info |
|
|
|
let register_users_sum = props.dataInfo.register_users_sum || 0 |
|
|
|
let order_users_sum = props.dataInfo.order_users_sum || 0 |
|
|
|
|
|
|
|
baseList.value = [] |
|
|
|
|
|
|
|
// if(index.current <= info.userHhRole){ |
|
|
|
// baseList.value.push({ |
|
|
|
// title: '已达成', |
|
|
|
// num: "" |
|
|
|
// }) |
|
|
|
// return |
|
|
|
// } |
|
|
|
|
|
|
|
if(level.paramCondition){ |
|
|
|
baseList.value.push({ |
|
|
|
title: '仍需至少注册', |
|
|
|
num: (level.paramCondition - register_users_sum) + "人" |
|
|
|
}) |
|
|
|
} |
|
|
|
if(level.needOrderUserNum){ |
|
|
|
if(baseList.value.length > 0){ |
|
|
|
baseList.value.push({ |
|
|
|
title: '或', |
|
|
|
num: "" |
|
|
|
}) |
|
|
|
} |
|
|
|
baseList.value.push({ |
|
|
|
title: '仍需至少下单', |
|
|
|
num: (level.needOrderUserNum - order_users_sum) + "人" |
|
|
|
}) |
|
|
|
} |
|
|
|
|
|
|
|
// switch (index.current) { |
|
|
|
// case 0: |
|
|
|
// baseList.value = [{ |
|
|
|
// title: '仍需至少注册', |
|
|
|
// num: "20人" |
|
|
|
// }] |
|
|
|
// break; |
|
|
|
// case 1: |
|
|
|
// baseList.value = [{ |
|
|
|
// title: '仍需至少注册', |
|
|
|
// num: "20人" |
|
|
|
// }, |
|
|
|
// { |
|
|
|
// title: '或', |
|
|
|
// num: " " |
|
|
|
// }, |
|
|
|
// { |
|
|
|
// title: '仍需至少下单', |
|
|
|
// num: "5人" |
|
|
|
// } |
|
|
|
// ] |
|
|
|
// break; |
|
|
|
// case 2: |
|
|
|
// break; |
|
|
|
// case 3: |
|
|
|
// break; |
|
|
|
// case 4: |
|
|
|
// break; |
|
|
|
// } |
|
|
|
} |
|
|
|
</script> |
|
|
|
|
|
|
|