feat: 优化代码
This commit is contained in:
+107
-85
@@ -1,100 +1,112 @@
|
||||
<template>
|
||||
<view class="finance_warp">
|
||||
<template>
|
||||
<view class="finance_warp">
|
||||
<view class="finance_header_warp">
|
||||
<up-image src="/static/common/left.png" width="20" height="20" bgColor="#f1f6ff00" @click="jumpMine"></up-image>
|
||||
<view class="finance_header_type_warp">
|
||||
<view :class="type === 1 ? 'finance_header_item_warp finance_header_item_sel_warp':'finance_header_item_warp'" @click="type=1">股权架构</view>
|
||||
<view :class="type === 2 ? 'finance_header_item_warp finance_header_item_sel_warp':'finance_header_item_warp'" @click="type=2">营收数据</view>
|
||||
<view :class="type === 1 ? 'finance_header_item_warp finance_header_item_sel_warp' : 'finance_header_item_warp'"
|
||||
@click="type = 1">股权架构</view>
|
||||
<view :class="type === 2 ? 'finance_header_item_warp finance_header_item_sel_warp' : 'finance_header_item_warp'"
|
||||
@click="type = 2">营收数据</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="finance_content_warp" v-if="type === 1">
|
||||
<view class="finance_image_comm">
|
||||
<up-image src="/static/finance/gqjg.png" width="310" height="310" bgColor="#f1f6ff00" @click="jumpMine"></up-image>
|
||||
<up-image src="/static/finance/gqjg.png" width="310" height="310" bgColor="#f1f6ff00"
|
||||
@click="jumpMine"></up-image>
|
||||
</view>
|
||||
<view class="finance_card_comm">
|
||||
<view class="finance_card_item_comm" v-for="(item,index) in equityStructureData" :key="index">
|
||||
<view class="finance_card_item_title"><view class="finance_card_item_y_comm" :style="{'background':item.color}"></view>{{item.title}}</view>
|
||||
<view class="finance_card_item_value">净利润分红占比：<text class="_zb_warp" :style="{'color':item.color}">{{item.zb}}</text></view>
|
||||
<view class="finance_card_item_comm" v-for="(item, index) in equityStructureData" :key="index">
|
||||
<view class="finance_card_item_title">
|
||||
<view class="finance_card_item_y_comm" :style="{ 'background': item.color }"></view>{{ item.title }}
|
||||
</view>
|
||||
<view class="finance_card_item_value">净利润分红占比：<text class="_zb_warp" :style="{ 'color': item.color }">{{
|
||||
item.zb }}</text></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="finance_content_warp" v-if="type === 2">
|
||||
<view class="finance_image_comm">
|
||||
<up-image src="/static/finance/yssj.png" width="332" height="280" bgColor="#f1f6ff00" @click="jumpMine"></up-image>
|
||||
<up-image src="/static/finance/yssj.png" width="332" height="280" bgColor="#f1f6ff00"
|
||||
@click="jumpMine"></up-image>
|
||||
</view>
|
||||
<view class="finance_card_comm">
|
||||
<view class="finance_card_item_comm" v-for="(item,index) in revenueData" :key="index">
|
||||
<view class="finance_card_item_title"><view class="finance_card_item_y_comm" :style="{'background':item.color}"></view>{{item.title}}</view>
|
||||
<view class="finance_card_item_value">金额：<text class="_zb_warp" :style="{'color':item.color}">{{item.zb}}</text></view>
|
||||
<view class="finance_card_item_comm" v-for="(item, index) in revenueData" :key="index">
|
||||
<view class="finance_card_item_title">
|
||||
<view class="finance_card_item_y_comm" :style="{ 'background': item.color }"></view>{{ item.title }}
|
||||
</view>
|
||||
<view class="finance_card_item_value">金额：<text class="_zb_warp" :style="{ 'color': item.color }">{{ item.zb
|
||||
}}</text></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
type:1,
|
||||
equityStructureData:[
|
||||
{
|
||||
color:"#FC5E05",
|
||||
title:"市场股东",
|
||||
zb:"61%",
|
||||
},{
|
||||
color:"#FCC139",
|
||||
title:"原始股东",
|
||||
zb:"22%",
|
||||
},{
|
||||
color:"#BC52FD",
|
||||
title:"团队激励",
|
||||
zb:"10%",
|
||||
},{
|
||||
color:"#0474E0",
|
||||
title:"机构投资",
|
||||
zb:"7%",
|
||||
}
|
||||
],// 股权架构
|
||||
revenueData:[
|
||||
{
|
||||
color:"#FC5E05",
|
||||
title:"股东分红",
|
||||
zb:"2514.71",
|
||||
},{
|
||||
color:"#FCC139",
|
||||
title:"运营支撑",
|
||||
zb:"1508.83",
|
||||
},{
|
||||
color:"#BC52FD",
|
||||
title:"市场品牌推广",
|
||||
zb:"502.94",
|
||||
},{
|
||||
color:"#0474E0",
|
||||
title:"基金投资",
|
||||
zb:"502.94",
|
||||
}
|
||||
],// 营收数据
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
jumpMine(){
|
||||
uni.switchTab({ url: '/pages/mine/mine' });
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.finance_warp{
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
type: 1,
|
||||
equityStructureData: [
|
||||
{
|
||||
color: "#FC5E05",
|
||||
title: "市场股东",
|
||||
zb: "61%",
|
||||
}, {
|
||||
color: "#FCC139",
|
||||
title: "原始股东",
|
||||
zb: "22%",
|
||||
}, {
|
||||
color: "#BC52FD",
|
||||
title: "团队激励",
|
||||
zb: "10%",
|
||||
}, {
|
||||
color: "#0474E0",
|
||||
title: "机构投资",
|
||||
zb: "7%",
|
||||
}
|
||||
],// 股权架构
|
||||
revenueData: [
|
||||
{
|
||||
color: "#FC5E05",
|
||||
title: "股东分红",
|
||||
zb: "2514.71",
|
||||
}, {
|
||||
color: "#FCC139",
|
||||
title: "运营支撑",
|
||||
zb: "1508.83",
|
||||
}, {
|
||||
color: "#BC52FD",
|
||||
title: "市场品牌推广",
|
||||
zb: "502.94",
|
||||
}, {
|
||||
color: "#0474E0",
|
||||
title: "基金投资",
|
||||
zb: "502.94",
|
||||
}
|
||||
],// 营收数据
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
jumpMine() {
|
||||
uni.switchTab({ url: '/pages/mine/mine' });
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.finance_warp {
|
||||
height: 100%;
|
||||
.finance_header_warp{
|
||||
|
||||
.finance_header_warp {
|
||||
position: relative;
|
||||
padding: 100rpx 30rpx 30rpx 30rpx;
|
||||
border-bottom: 1rpx solid #EEEEEE;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.finance_header_type_warp{
|
||||
|
||||
.finance_header_type_warp {
|
||||
position: absolute;
|
||||
left: 30%;
|
||||
display: flex;
|
||||
@@ -102,55 +114,65 @@
|
||||
background: #EEEEEE;
|
||||
border-radius: 34rpx;
|
||||
}
|
||||
.finance_header_item_warp{
|
||||
|
||||
.finance_header_item_warp {
|
||||
padding: 16rpx 30rpx;
|
||||
font-weight: bold;
|
||||
font-size: 28rpx;
|
||||
color: #666666;
|
||||
}
|
||||
.finance_header_item_sel_warp{
|
||||
|
||||
.finance_header_item_sel_warp {
|
||||
background: #FF8431;
|
||||
color: #EEEEEE;
|
||||
border-radius: 34rpx;
|
||||
}
|
||||
}
|
||||
.finance_content_warp{
|
||||
|
||||
.finance_content_warp {
|
||||
padding: 0rpx 30rpx 30rpx;
|
||||
.finance_image_comm{
|
||||
|
||||
.finance_image_comm {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 60rpx;
|
||||
}
|
||||
.finance_card_comm{
|
||||
|
||||
.finance_card_comm {
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0rpx 0rpx 29rpx 0rpx #E5E5E5;
|
||||
border-radius: 30rpx;
|
||||
padding: 30rpx;
|
||||
margin-top: 50rpx;
|
||||
}
|
||||
.finance_card_item_comm{
|
||||
|
||||
.finance_card_item_comm {
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
.finance_card_item_title{
|
||||
|
||||
.finance_card_item_title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.finance_card_item_value{
|
||||
|
||||
.finance_card_item_value {
|
||||
font-weight: 500;
|
||||
font-size: 26rpx;
|
||||
color: #666666;
|
||||
margin-top: 10rpx;
|
||||
._zb_warp{
|
||||
|
||||
._zb_warp {
|
||||
font-weight: 800;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
}
|
||||
.finance_card_item_y_comm{
|
||||
|
||||
.finance_card_item_y_comm {
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
border-radius: 50%;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user