<script setup> /** * 榴莲首页 */ import { useStore, } from 'vuex' import { onMounted, ref, reactive, computed, getCurrentInstance, watch, defineExpose, } from 'vue'; import { onLoad, onReady, onHide, } from '@dcloudio/uni-app' // 未登录 import noLogin from '@/components/login/noLogin.vue' // 工具库 import util from '@/common/js/util.js' // 进度 import task from '@/components/index/task' import intergralApi from '@/api/intergral.js'; import durianlApi from '@/api/durian.js'; const { proxy } = getCurrentInstance() // 仓库 const store = useStore() // 互转表单 const form = reactive({ account: '', sellNum: '', }) //读秒记录 const viewData = ref({ seconds: 0 }) // 用户信息 const userinfo = computed(() => { let result = store.state.userinfo return result }) // 进度条 const progress = computed(() => { let result = viewData.value.seconds result = Math.min(Number(result), 100) return result }) // 我的钱包 const purse = computed(() => { let result = store.state.purse || {} return result }) onReady(() => { // proxy.$refs.dealRef.open() }) onLoad(() => { // 获取钱包 util.getPurse() }) // 榴莲果交易 function transfer() { durianlApi.transfer({ query: { account: form.account, sellNum: form.sellNum } }).then(rs => { if (rs.code === 200) { util.alert('操作成功') util.getUserinfo() return } util.alert({ content: rs.msg, showCancel: false, }) }) } // 跳转 function navigateToPage(path) { uni.navigateTo({ url: path }) } </script> <template> <view class="page" v-if="!userinfo.id"> <noLogin class="f1" /> </view> <view class="appbw plr30" v-else> <!-- 有效读秒 --> <view class="task mtb30"> <task /> </view> <!-- 树苗 --> <view class="sapling bgColor mtb30 ptb15 plr30"> <view class="df"> <view class="f1 fmid"> <image class="wh110" src="/static/sapling.png" mode="aspectFit" /> </view> <view class="f1 fmid"> <view class=" f38 b wsn">* {{purse.seed}}</view> </view> </view> </view> <!-- 说明 --> <view class="explain ptb30 plr30 bgColor"> <view class="df"> <view class="list f1 fmid"> <view class="item ver f1"> <image class="wh300" src="/static/tree.png" mode="aspectFit" /> </view> </view> <view class="df fdc jcsa f1"> <view class="button btn colourful plr30" @click="navigateToPage('/pages/index/orchard')">置换</view> <view class="button btn colourful plr30 fmid" @click="navigateToPage('/pages/index/durainActivation')"> <view class="">我的榴莲果树</view> </view> </view> </view> </view> <!-- 榴莲果专区 --> <view class="durianSection bgColor mtb30 ptb30 plr30"> <!-- <image class="fruit" src="/static/fruit.png" mode="aspectFit" /> --> <view class="df mlr30"> <view class="ver f1"> <navigator url="/pages/index/durianLog" hover-class="none"> <image class="fruit wh150" src="/static/fruit.png" mode="aspectFit" /> <view class="mt30 f20"> <view class=" f1 b">可用: {{purse.fruit}}</view> <view class="cFF4242 f1 mt10">待释放: 105.53</view> </view> </navigator> </view> <view class="notice df fdc jcsa aic f1"> <view class="item ver f1" @click="$refs.dealRef.open()"> <view class="key fmid c333 f24">互转</view> <!-- <view class="value mt5 c333 f20">销毁30%</view> --> </view> <view class="item ver f1 mt30" @click="navigateToPage('/pages/index/trade')"> <view class="key fmid c333 f24">交易</view> <!-- <view class="value mt5 c333 f20">求购 出售</view> --> </view> </view> </view> <view class="btn plus black mt60 mlr60" @click="navigateToPage('/pages/index/extend')">置换流量</view> </view> <view class="fill" style="height: 60rpx;"></view> </view> <!-- 互转 --> <uni-popup ref="dealRef" type="center"> <view class="dealAlt popMid ptb40 plr60 bfff br30"> <view class="title tac c333 f28">榴莲果互转</view> <view class="content rows mtb10"> <image class="wh140" src="/static/fruit.png" mode="aspectFit" /> <image class="wh70" src="/static/dealMid.png" mode="aspectFit" /> <image class="wh140" src="/static/dealUser.png" mode="aspectFit" /> </view> <view class="inputBox mtb20 plr30"> <input v-model="form.account" type="text" placeholder="输入对方账号" /> </view> <view class="inputBox mtb20 plr30"> <input v-model="form.sellNum" type="number" placeholder="输入数量" /> </view> <view class="hint mtb30 tac f20"> <view>销毁15%</view> <!-- <view>互转成功之后冻结24h</view> --> <view>(最低x起转)</view> </view> <view class="button btn lg bar black" @click="transfer">转移</view> </view> </uni-popup> </template> <style lang="scss"> // .board { background-image: linear-gradient(103deg, #27EFE2 0%, #A45EFF 43%, #FF004F 100%); } // 背景颜色 .bgColor { background-color: #FFFBF3; border-radius: 20rpx; } .explain { .button { width: 250rpx; margin-left: 0; } } // 树苗 .sapling { .button { width: 300rpx; } } // 榴莲果专区 .durianSection { // 须知 .notice { .key { width: 140rpx; height: 70rpx; color: #fff; background: linear-gradient(99deg, #27efe2 0%, #a45eff 43%, #ff004f 100%), linear-gradient(108deg, #d7f550 -2%, #afef4d 98%); border-radius: 100rpx; } } } // .dealAlt { .hint { color: #3d3d3d; opacity: .7; } } </style>