You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
298 lines
10 KiB
298 lines
10 KiB
<template>
|
|
<view class="more" :style="{'--statusbar': statusBarHeight + 'px'}">
|
|
<view class="nav" :style="{paddingTop: statusBarHeight + 'px'}">
|
|
<view class="nav-back" @tap="goBack"><text>‹</text></view>
|
|
<view class="nav-title">星球补给地图</view>
|
|
</view>
|
|
|
|
<scroll-view scroll-y class="page" :style="{paddingTop: (statusBarHeight + 58) + 'px'}">
|
|
<view v-if="loading" class="loading-card">正在加载星球补给...</view>
|
|
<block v-else>
|
|
<view class="hero">
|
|
<view>
|
|
<view class="hero-kicker">PLANET SUPPLY</view>
|
|
<view class="hero-title">把长期玩法都放在这里</view>
|
|
<view class="hero-sub">券树、仓库、防御塔、地标、任务和能量站，想深入经营时再进来。</view>
|
|
</view>
|
|
<view class="hero-ticket">
|
|
<text>{{home.myTicketCount || 0}}</text>
|
|
<text>星球券</text>
|
|
</view>
|
|
</view>
|
|
|
|
<planet-news :list="home.newsList"></planet-news>
|
|
|
|
<planet-operate
|
|
:data="home.operate"
|
|
@plant="onPlantTree"
|
|
@harvest="onHarvestTree"
|
|
@store="onStoreWarehouse"
|
|
@take="onTakeWarehouse"
|
|
@upgradeWarehouse="onUpgradeWarehouse"
|
|
@upgradeTower="onUpgradeTower"
|
|
@search="onRandomSearch"
|
|
@bid="onBidLandmark">
|
|
</planet-operate>
|
|
|
|
<planet-tasks
|
|
:tasks="home.tasks"
|
|
@claim="onClaimTask">
|
|
</planet-tasks>
|
|
|
|
<buff-shop
|
|
:list="home.buffShop"
|
|
:my-ticket="home.myTicketCount"
|
|
@buy="onBuyBuff">
|
|
</buff-shop>
|
|
|
|
<view class="bottom-space"></view>
|
|
</block>
|
|
</scroll-view>
|
|
|
|
<hunt-modal
|
|
:show="huntModal.show"
|
|
:phase="huntModal.phase"
|
|
:result="huntModal.result"
|
|
:target="huntModal.target"
|
|
@close="closeHunt">
|
|
</hunt-modal>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import planetTasks from '@/package1/components/planet/planet-tasks.vue'
|
|
import huntModal from '@/package1/components/planet/hunt-modal.vue'
|
|
import buffShop from '@/package1/components/planet/buff-shop.vue'
|
|
import planetNews from '@/package1/components/planet/planet-news.vue'
|
|
import planetOperate from '@/package1/components/planet/planet-operate.vue'
|
|
|
|
export default {
|
|
components: {
|
|
planetTasks,
|
|
huntModal,
|
|
buffShop,
|
|
planetNews,
|
|
planetOperate
|
|
},
|
|
data() {
|
|
return {
|
|
statusBarHeight: 20,
|
|
loading: true,
|
|
userId: '',
|
|
regionId: '',
|
|
nickname: '',
|
|
avatar: '',
|
|
college: '',
|
|
home: {
|
|
myTicketCount: 0,
|
|
tasks: [],
|
|
buffShop: [],
|
|
newsList: [],
|
|
operate: {}
|
|
},
|
|
huntModal: {
|
|
show: false,
|
|
phase: 'searching',
|
|
result: null,
|
|
target: {}
|
|
}
|
|
}
|
|
},
|
|
onLoad() {
|
|
const sys = uni.getSystemInfoSync()
|
|
this.statusBarHeight = sys.statusBarHeight || 20
|
|
this.userId = uni.getStorageSync('id') || ''
|
|
this.nickname = uni.getStorageSync('nickName') || uni.getStorageSync('nickname') || ''
|
|
this.avatar = uni.getStorageSync('avatarUrl') || uni.getStorageSync('avatar') || ''
|
|
try {
|
|
const area = uni.getStorageSync('area')
|
|
if (area) this.regionId = JSON.parse(area).id || ''
|
|
} catch (e) {}
|
|
this.loadHome()
|
|
},
|
|
methods: {
|
|
loadHome(silent) {
|
|
if (!this.userId) {
|
|
this.tui.toast('请先登录')
|
|
return
|
|
}
|
|
if (!this.regionId) {
|
|
this.loading = false
|
|
this.tui.toast('未获取到校区信息')
|
|
return
|
|
}
|
|
if (!silent) this.loading = true
|
|
this.tui.request('/app/planet/home', 'POST', {
|
|
userId: this.userId,
|
|
regionId: this.regionId,
|
|
nickname: this.nickname,
|
|
avatar: this.avatar,
|
|
college: this.college
|
|
}, false, false, true).then((res) => {
|
|
this.loading = false
|
|
if (res.code == 200 && res.result) {
|
|
this.home = res.result
|
|
} else if (res.message) {
|
|
this.tui.toast(res.message)
|
|
}
|
|
}).catch(() => {
|
|
this.loading = false
|
|
})
|
|
},
|
|
onClaimTask(task) {
|
|
this.tui.request('/app/planet/task/claim', 'POST', {
|
|
userId: this.userId,
|
|
regionId: this.regionId,
|
|
taskCode: task.code
|
|
}).then((res) => {
|
|
this.tui.toast(res.message, 1500, res.code == 200)
|
|
if (res.code == 200) this.loadHome(true)
|
|
})
|
|
},
|
|
onBuyBuff(buff) {
|
|
if (buff.active) {
|
|
this.tui.toast('该增益正在生效中')
|
|
return
|
|
}
|
|
if (this.home.myTicketCount < buff.costTickets) {
|
|
this.tui.toast('星球券不足')
|
|
return
|
|
}
|
|
this.tui.modal('确认购买', `消耗 ${buff.costTickets} 张星球券购买「${buff.name}」？`, true, (ok) => {
|
|
if (!ok) return
|
|
this.operateRequest('/app/planet/buff/buy', { buffId: buff.id }, '购买成功')
|
|
})
|
|
},
|
|
promptTickets(title, callback) {
|
|
uni.showModal({
|
|
title,
|
|
editable: true,
|
|
placeholderText: '输入星球券数量',
|
|
success: (res) => {
|
|
if (!res.confirm) return
|
|
const tickets = parseInt(res.content || '0', 10)
|
|
if (!tickets || tickets <= 0) {
|
|
this.tui.toast('请输入正确数量')
|
|
return
|
|
}
|
|
callback(tickets)
|
|
}
|
|
})
|
|
},
|
|
operateRequest(url, data, successText) {
|
|
this.tui.request(url, 'POST', Object.assign({
|
|
userId: this.userId,
|
|
regionId: this.regionId
|
|
}, data || {})).then((res) => {
|
|
this.tui.toast(res.code == 200 ? successText : res.message, 1500, res.code == 200)
|
|
if (res.code == 200) this.loadHome(true)
|
|
})
|
|
},
|
|
onPlantTree(config) {
|
|
this.promptTickets(`投入 ${config.cycleHours}h 券树`, (tickets) => {
|
|
this.operateRequest('/app/planet/tree/plant', { configId: config.id, tickets }, '种植成功')
|
|
})
|
|
},
|
|
onHarvestTree(order) {
|
|
if (order.status === 2) {
|
|
this.tui.toast('这棵券树已经收获')
|
|
return
|
|
}
|
|
this.operateRequest('/app/planet/tree/harvest', { orderId: order.id }, '收获成功')
|
|
},
|
|
onStoreWarehouse() {
|
|
this.promptTickets('存入松鼠仓库', (tickets) => {
|
|
this.operateRequest('/app/planet/warehouse/store', { tickets }, '存入成功')
|
|
})
|
|
},
|
|
onTakeWarehouse() {
|
|
this.promptTickets('从仓库取出', (tickets) => {
|
|
this.operateRequest('/app/planet/warehouse/take', { tickets }, '取出成功')
|
|
})
|
|
},
|
|
onUpgradeWarehouse() {
|
|
this.tui.modal('升级仓库', '确认消耗星球券升级松鼠仓库？', true, (ok) => {
|
|
if (ok) this.operateRequest('/app/planet/warehouse/upgrade', {}, '升级成功')
|
|
})
|
|
},
|
|
onUpgradeTower() {
|
|
this.tui.modal('升级防御塔', '确认消耗星球券提升拦截能力？', true, (ok) => {
|
|
if (ok) this.operateRequest('/app/planet/tower/upgrade', {}, '升级成功')
|
|
})
|
|
},
|
|
onRandomSearch() {
|
|
this.startSearch('/app/planet/search/random', {}, { nickname: '随机同校区玩家' })
|
|
},
|
|
onBidLandmark(item) {
|
|
this.promptTickets(`争夺${item.name}`, (tickets) => {
|
|
this.operateRequest('/app/planet/landmark/bid', { landmarkId: item.id, tickets }, '投入成功')
|
|
})
|
|
},
|
|
startSearch(url, data, target) {
|
|
this.huntModal.show = true
|
|
this.huntModal.phase = 'searching'
|
|
this.huntModal.result = null
|
|
this.huntModal.target = target || { nickname: '同校区玩家' }
|
|
setTimeout(() => { this.huntModal.phase = 'locking' }, 900)
|
|
setTimeout(() => { this.huntModal.phase = 'chasing' }, 1800)
|
|
this.tui.request(url, 'POST', Object.assign({
|
|
userId: this.userId,
|
|
regionId: this.regionId
|
|
}, data || {}), false, false, true).then((res) => {
|
|
setTimeout(() => {
|
|
if (res.code == 200 && res.result) {
|
|
this.huntModal.result = {
|
|
result: res.result.intercepted ? 'shield' : 'success',
|
|
message: res.result.message,
|
|
gainTickets: res.result.gainTickets,
|
|
totalGain: res.result.gainTickets,
|
|
remainHunt: res.result.remainSearchCount
|
|
}
|
|
this.huntModal.phase = 'result'
|
|
this.loadHome(true)
|
|
} else {
|
|
this.huntModal.show = false
|
|
this.tui.toast(res.message)
|
|
}
|
|
}, 2200)
|
|
}).catch(() => {
|
|
this.huntModal.show = false
|
|
})
|
|
},
|
|
closeHunt() {
|
|
this.huntModal.show = false
|
|
this.huntModal.result = null
|
|
},
|
|
goBack() {
|
|
uni.navigateBack({
|
|
delta: 1,
|
|
fail() {
|
|
uni.navigateTo({ url: '/package1/planet/index' })
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.more {
|
|
min-height: 100vh;
|
|
background: linear-gradient(155deg, #F3FFF4 0%, #EAF8FF 46%, #FFF8DE 100%);
|
|
color: #12342F;
|
|
}
|
|
.nav { position: fixed; top: 0; left: 0; right: 0; height: 44px; z-index: 20; display: flex; align-items: center; justify-content: center; box-sizing: content-box; background: linear-gradient(180deg, rgba(243,255,244,0.96), rgba(243,255,244,0)); }
|
|
.nav-back { position: absolute; left: 20rpx; bottom: 0; height: 44px; width: 60rpx; display: flex; align-items: center; justify-content: center; }
|
|
.nav-back text { color: #12342F; font-size: 48rpx; font-weight: 300; }
|
|
.nav-title { color: #12342F; font-size: 34rpx; font-weight: 900; align-self: flex-end; padding-bottom: 6rpx; }
|
|
.page { height: 100vh; box-sizing: border-box; padding-left: 22rpx; padding-right: 22rpx; }
|
|
.loading-card { margin-top: 24rpx; height: 220rpx; border-radius: 38rpx; background: rgba(255,255,255,0.76); display: flex; align-items: center; justify-content: center; color: #6B817D; font-size: 26rpx; }
|
|
.hero { margin-top: 24rpx; padding: 32rpx; border-radius: 42rpx; background: linear-gradient(145deg, rgba(255,255,255,0.92), rgba(239,255,249,0.74)); border: 2rpx solid rgba(255,255,255,0.92); box-shadow: 0 22rpx 54rpx rgba(53,214,166,0.12); display: flex; justify-content: space-between; gap: 20rpx; }
|
|
.hero-kicker { color: #59CBB5; font-size: 20rpx; font-weight: 900; letter-spacing: 3rpx; }
|
|
.hero-title { margin-top: 8rpx; color: #12342F; font-size: 38rpx; font-weight: 900; }
|
|
.hero-sub { margin-top: 10rpx; color: #6B817D; font-size: 24rpx; line-height: 1.45; }
|
|
.hero-ticket { width: 140rpx; height: 120rpx; border-radius: 34rpx; background: linear-gradient(145deg, #35D6A6, #4FB7FF); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; flex-shrink: 0; }
|
|
.hero-ticket text:first-child { font-size: 36rpx; font-weight: 900; }
|
|
.hero-ticket text:last-child { margin-top: 4rpx; font-size: 20rpx; }
|
|
.bottom-space { height: 60rpx; }
|
|
</style>
|
|
|