81 lines
1.7 KiB
Vue
81 lines
1.7 KiB
Vue
<template>
|
|
<view v-if="pageData && pageData.goods.rage_is == 1" class="angry">
|
|
<view class="icon flex">
|
|
<image class="img100" src="/static/common/cardIcon.png" lazy-load></image>
|
|
</view>
|
|
<view class="ang-info">
|
|
<view class="ang-num">怒气值:{{ pageData.goods.user_rage }}</view>
|
|
<view class="progress">
|
|
<cmd-progress :percent="pageData.goods.user_rage_schedule" :show-info="false"
|
|
stroke-color="#FFFFFF;" stroke-shape="round" :strokeWidth="8"></cmd-progress>
|
|
</view>
|
|
<view class="tip">
|
|
{{ pageData.goods.item_card_info }}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'DetailWuxianRage',
|
|
props: {
|
|
pageData: {
|
|
type: Object,
|
|
default: () => ({})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.angry {
|
|
margin: 30rpx auto 0;
|
|
width: 690rpx;
|
|
height: 136rpx;
|
|
box-sizing: border-box;
|
|
padding: 0 30rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
background: #3B3941;
|
|
border-radius: 24rpx 24rpx 24rpx 24rpx;
|
|
border: 2rpx solid #FFFFFF;
|
|
|
|
.icon {
|
|
width: 100rpx;
|
|
height: 58rpx;
|
|
}
|
|
|
|
.ang-info {
|
|
width: 490rpx;
|
|
|
|
.ang-num {
|
|
text-align: center;
|
|
font-size: 24rpx;
|
|
font-family: Source Han Sans CN;
|
|
font-weight: 400;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.progress {
|
|
margin-top: 10rpx;
|
|
|
|
/deep/.cmd-progress-inner {
|
|
border-radius: 0;
|
|
background: #444444;
|
|
}
|
|
}
|
|
|
|
.tip {
|
|
margin-top: 20rpx;
|
|
display: flex;
|
|
font-size: 20rpx;
|
|
font-family: Source Han Sans CN;
|
|
font-weight: 400;
|
|
color: #ffffff;
|
|
line-height: 20rpx;
|
|
}
|
|
}
|
|
}
|
|
</style> |