167 lines
3.2 KiB
Vue
167 lines
3.2 KiB
Vue
<script setup>
|
||
import {
|
||
onMounted,
|
||
ref,
|
||
reactive,
|
||
computed,
|
||
getCurrentInstance,
|
||
watch,
|
||
defineExpose,
|
||
} from 'vue';
|
||
import {
|
||
useStore,
|
||
} from 'vuex'
|
||
import {
|
||
onLoad
|
||
} from '@dcloudio/uni-app'
|
||
// 工具库
|
||
import util from '@/common/js/util';
|
||
//
|
||
import api from '@/api/index.js';
|
||
const treeData = ref([])
|
||
const store = useStore()
|
||
const userinfo = computed(() => {
|
||
let result = store.state.userinfo
|
||
return result
|
||
})
|
||
|
||
onLoad(() => {
|
||
// 获取榴莲果树
|
||
buyDurianList()
|
||
})
|
||
|
||
// 我的榴莲果树
|
||
function buyDurianList() {
|
||
api.durian.buyDurianList({}).then(rs => {
|
||
if (rs.code == 200) {
|
||
// 我的榴莲果树
|
||
treeData.value = rs.data.dataList.map(item => {
|
||
// orderType 0赠送 1兑换
|
||
item.style = {
|
||
'0': {
|
||
1: 'scroll1',
|
||
2: 'scroll2',
|
||
3: 'scroll3',
|
||
4: 'scroll4',
|
||
} [item.durianConfigId],
|
||
'1': {
|
||
1: 'buy1',
|
||
2: 'buy2',
|
||
3: 'buy3',
|
||
4: 'buy4',
|
||
} [item.durianConfigId],
|
||
} [item.orderType]
|
||
item.formatHash = formatStr(item.treeHash)
|
||
return item
|
||
})
|
||
return
|
||
}
|
||
util.alert({
|
||
content: rs.msg,
|
||
showCancel: false
|
||
})
|
||
})
|
||
}
|
||
|
||
/**
|
||
* 处理字符串
|
||
* @param {Object} str
|
||
*/
|
||
function formatStr(str) {
|
||
// 如果字符串长度小于等于6，直接返回原字符串
|
||
if (str.length <= 6) return str
|
||
return str.slice(0, 3) + '***' + str.slice(-3); // 拼接结果
|
||
}
|
||
|
||
|
||
/**
|
||
* 跳转详情
|
||
* @param {Object} item
|
||
*/
|
||
function handleDetail(item) {
|
||
uni.navigateTo({
|
||
url: util.setUrl('/pages/index/durianLog', {
|
||
id: item.durianTreeId,
|
||
})
|
||
})
|
||
}
|
||
|
||
/**
|
||
* 复制
|
||
* @param {Object} ev 需要复制的码
|
||
*/
|
||
function handleCopy(ev) {
|
||
util.copyText(ev)
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<view class="appbw">
|
||
<!-- -->
|
||
<view class="list mlr40">
|
||
<view class="item rows mtb25 br15" v-for="(item,index) in treeData" :key="index" @click="handleDetail(item)"
|
||
:class="item.style">
|
||
<image class="wh180 fs0" src="/static/tree.png" mode="aspectFit" />
|
||
|
||
<view class="col f1 ml30 mtb30 c333 f26">
|
||
<view class="txt mtb10">每日可释放：{{item.releasableDaily}}</view>
|
||
<view class="txt mtb10">剩余可释放：{{item.remainFruitCount}}</view>
|
||
<view class="txt mtb10">当前级别：{{item.treeName}}</view>
|
||
<view class="txt mtb10" @click.stop="util.copyText(item.treeHash)">
|
||
<text>哈希值： {{item.formatHash}}</text>
|
||
<image class="wh20 ml10" src="/static/copy.png" mode="aspectFit" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="tac c999 f40 mt80" v-if="!treeData[0]">当前暂无榴莲果树~</view>
|
||
</view>
|
||
|
||
<!-- 填充 -->
|
||
<view class="fill" style="height: 60rpx;"></view>
|
||
</view>
|
||
</template>
|
||
|
||
<style lang="scss">
|
||
//
|
||
.list {
|
||
|
||
// 默认
|
||
.item {
|
||
background-color: #F4F4F4;
|
||
}
|
||
|
||
// 卷轴赠送
|
||
.scroll1 {
|
||
background-color: #F4F4F4;
|
||
}
|
||
|
||
.scroll2 {
|
||
background-color: #E4FBFF;
|
||
}
|
||
|
||
.scroll3 {
|
||
background-color: #CACDFF;
|
||
}
|
||
|
||
.scroll4 {
|
||
background-color: #F4CAFF;
|
||
}
|
||
|
||
// 普通购买
|
||
.buy1 {
|
||
background-color: rgb(225, 253, 204);
|
||
}
|
||
|
||
.buy2 {
|
||
background-color: #FFF0B1;
|
||
}
|
||
|
||
.buy3 {
|
||
background-color: #CAF0F3;
|
||
}
|
||
|
||
.buy4 {
|
||
background-color: #FBC5C5;
|
||
}
|
||
}
|
||
</style> |