h5-uniapp/pages/index/investor/index.vue

<template>
	<view class="">
		<myNav title="" background="rgba(255,255,255,0)" blackColor="#fff" :isRight="true" righturl="/static/imgs/index/touziRIght@2x.png" @Jump="router.push('/pages/index/investor/record')"></myNav>
		<image style="position: fixed;top: 0rpx;height: calc(100vh);z-index: 0;" class="width-100b" src="/static/imgs/index/touyziBG@2x.png" mode=""></image>
	
	<view class="padding-w-30 relative">
		<p class="font-42 color-white nummedium-font">{{i18n.Investors.title}}</p>
		<view class="font-28 color-white margin-c-28 line-height-48">
			{{data.content_txt}}......<text @click="router.push('/pages/index/investor/details?text='+data.content)" class="">{{i18n.Investors.more}}<i class="cuIcon-right"></i></text>
		</view>
		
		<view class="padding-w-20 padding-c-10 bj-white radiu-4 margin-c-28" style="box-shadow: 0px 3px 6px rgba(232, 232, 232, 0.16);">
			<view class="height-60 flex align-center justify-between">
				<text class="font-26 nummedium-font color-333333">{{i18n.Investors.totalSales}}：</text>
				<text class="font-32 numbold-font color-333333">{{data.all_num}} {{data.curr_name}}</text>
			</view>
			<view class="height-60 flex align-center justify-between">
				<text class="font-26 nummedium-font color-333333">{{data.jieduan}}：</text>
				<text class="font-32 numbold-font color-333333">{{data.count_num}} {{data.curr_name}}</text>
			</view>
			<view class="height-60 flex align-center justify-between">
				<text class="font-26 nummedium-font color-333333">{{i18n.Investors.lave}}：</text>
				<text class="font-32 numbold-font color-333333">{{data.real_num}} {{data.curr_name}}</text>
			</view>
			<view class="height-60 flex align-center justify-between">
				<text class="font-26 nummedium-font color-333333">{{i18n.Investors.price}}：</text>
				<text class="font-32 numbold-font color-333333">1 APT = {{data.price}} USDT</text>
			</view>
		</view>
		<view class="padding-w-20 padding-c-10 bj-white radiu-4 margin-c-28" style="box-shadow: 0px 3px 6px rgba(232, 232, 232, 0.16);">
			<view class="height-60 flex align-center">
				<text class="font-26 weight-bold numbold-font color-333333">{{i18n.Investors.num}}</text>
			</view>
			<view class="height-96 flex align-center justify-between font-30">
				<input class="color-333333 nummedium-font" type="number" v-model="touziNum" :placeholder="i18n.Investors.inputNum" placeholder-style="color:#8B99A2;"/>
				<text class="color-333333 nummedium-font">USDT</text>
			</view>
			<view class="height-60 flex align-center nummedium-font font-24">
				<text class="color-333333">
                  {{i18n.Investors.zehe}}：
                </text>
				<text class="color-0165EE">
                  {{allNum}} APT
                </text>
			</view>
			<view class="height-60 flex align-center">
				<text class="font-26 weight-bold numbold-font color-333333">{{i18n.Investors.pay_pwd}}</text>
			</view>
			<view class="height-96 flex align-center justify-between font-30">
				<input class="color-333333 nummedium-font flex-1" type="text" password v-model="pay_pwd" :placeholder="i18n.Investors.inputPwd" placeholder-style="color:#8B99A2;"/>
			</view>
		</view>
		<view @click="touzi" v-if="data.status==1" class="canyuBtn nummedium-font">{{i18n.Investors.canyu}}</view>
		<view v-else class="canyuBtn_hui nummedium-font">{{i18n.Investors.canyu}}</view>
		
	</view>
	<view class="height-40"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				data:'',
				
				touziNum:'',
				pay_pwd:'',
				
				flag:true
			}
		},
		computed: {
			i18n() {
				return this.$t('message');
			},
			allNum(){
				let temp = 0
				temp = this.touziNum / this.data.price
				return temp.toFixed(4)
			}
		},
		onShow() {
			this.getInfo()
		},
		methods: {
			getInfo(){
				this.post('/angel/angel_content').then(res => {
					console.log('天使投资返回',res)
					if(res.code == 1){
						this.data = res.data
					}
				})
			},
			touzi(){
				if(!this.flag) return
				if(this.touziNum == ''){
					this.tos(this.i18n.Investors.inputNum)
					return
				}
				if(this.pay_pwd == ''){
					this.tos(this.i18n.Investors.inputPwd)
					return
				}
				uni.showLoading({
					mask:true
				})
				this.flag = false
				this.post('/angel/angel_sub',{
					id:this.data.id,
					num:this.touziNum,
					pay_pwd:this.pay_pwd
				}).then(res => {
					console.log('天使投资参与',res)
					uni.hideLoading()
					this.flag = true
					if(res.code == 1){
						this.tos(res.msg)
						this.touziNum = ''
						this.pay_pwd = ''
						setTimeout(()=>{
							uni.navigateTo({
								url:'/pages/index/investor/record'
							})
						},500)
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	page{
		background-color: #398CFF;
	}
	.canyuBtn{
		width: 600rpx;
		height: 86rpx;
		margin: 30rpx auto;
		background: #FFFFFF;
		color: #0165EE;
		text-align: center;
		line-height: 86rpx;
		font-size: 32rpx;
		border-radius: 20rpx;
	}
	.canyuBtn_hui{
		width: 600rpx;
		height: 86rpx;
		margin: 30rpx auto;
		background: #999;
		color: #ddd;
		text-align: center;
		line-height: 86rpx;
		font-size: 32rpx;
		border-radius: 20rpx;
	}
</style>