231 lines
13 KiB
Vue
231 lines
13 KiB
Vue
<template>
|
|
<view>
|
|
<!-- 资产负债表 -->
|
|
<view @click="itemClick(0)" style="color: #2B2B2B; font-weight: 500; font-size: 24rpx;">
|
|
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
|
<image src="/pagesStock/static/icon/cwfx-1.png" mode="widthFix"
|
|
style="width: 40rpx; height: 40rpx;"></image>
|
|
<view class="flex1" style="margin: 0 10rpx; font-size: 28rpx;">资产负债表</view>
|
|
<image src="/static/icon/home/conceptCenter/next.png" mode="widthFix"
|
|
style="width: 13rpx; height: 22rpx;"></image>
|
|
</view>
|
|
|
|
<view style="display: grid; gap: 20rpx; grid-template-columns: repeat(3, 1fr); margin: 0 20rpx;">
|
|
<view
|
|
style="display: flex; align-items: center; justify-content: center; text-align: center; font-size: 20rpx; color: #999999; border: 1rpx solid #D2D2D2; padding: 10rpx 10rpx; box-sizing: border-box;"
|
|
:style="{color: index == 0 ? '#BB8520' : '#999999', border: `1rpx solid ${index == 0 ? '#F2C369' : '#D2D2D2'}`, 'background-color': (index == 0 ? '#FFFAF1' : '#FFFFFF')}"
|
|
v-for="(item,index) in ['货币资金', '所有者权益', '关键指标']" :key="index">
|
|
{{item}}
|
|
</view>
|
|
</view>
|
|
|
|
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
|
<view class="flex1" style="font-size: 28rpx;">查看详细数据</view>
|
|
<view
|
|
style="color: #F2C369; font-size: 22rpx; padding: 2rpx 10rpx; border-radius: 5rpx; border: 1rpx solid #F2C369; text-align: center; margin: 0 10rpx;">
|
|
单季度</view>
|
|
<view
|
|
style="display: flex; align-items: center; padding: 3rpx 10rpx; box-sizing: border-box; border: 1rpx solid #D2D2D2;">
|
|
<image style="width: 23rpx; height: 23rpx;" src="/pagesStock/static/icon/all-icon.png"
|
|
mode="widthFix"></image>
|
|
<view style="margin: 0 10rpx; color: #999999; font-size: 22rpx;">全部</view>
|
|
<image style="width: 11rpx; height: 6rpx;" src="/pagesStock/static/icon/all-down.png"
|
|
mode="widthFix"></image>
|
|
</view>
|
|
</view>
|
|
|
|
<view
|
|
style="height: 400rpx; display: flex; align-items: center; justify-content: center; background-color: red;">
|
|
折线图占位
|
|
</view>
|
|
|
|
<view style="background-color: #FAFAFC; border-radius: 10rpx; margin: 0 20rpx; padding: 20rpx 0;">
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">资产总计</view>
|
|
<view style="text-align: right; color: #2A2A2A;">29.21亿</view>
|
|
</view>
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">负债合计</view>
|
|
<view style="text-align: right; color: #2A2A2A;">17.94亿</view>
|
|
</view>
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">所有者权益</view>
|
|
<view style="text-align: right; color: #2A2A2A;">11.27亿</view>
|
|
</view>
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">货币资金</view>
|
|
<view style="text-align: right; color: #2A2A2A;">5.45亿</view>
|
|
</view>
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">资本公积金</view>
|
|
<view style="text-align: right; color: #2A2A2A;">4.61亿</view>
|
|
</view>
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">盈余公积金</view>
|
|
<view style="text-align: right; color: #2A2A2A;">1.02亿</view>
|
|
</view>
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">未分配利润</view>
|
|
<view style="text-align: right; color: #2A2A2A;">1.61亿</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
</view>
|
|
<!-- 现金流量表 -->
|
|
<view @click="itemClick(1)" style="color: #2B2B2B; font-weight: 500; font-size: 24rpx;">
|
|
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
|
<image src="/pagesStock/static/icon/cwfx-1.png" mode="widthFix"
|
|
style="width: 40rpx; height: 40rpx;"></image>
|
|
<view class="flex1" style="margin: 0 10rpx; font-size: 28rpx;">现金流量表</view>
|
|
<image src="/static/icon/home/conceptCenter/next.png" mode="widthFix"
|
|
style="width: 13rpx; height: 22rpx;"></image>
|
|
</view>
|
|
|
|
<view style="display: grid; gap: 20rpx; grid-template-columns: repeat(3, 1fr); margin: 0 20rpx;">
|
|
<view
|
|
style="display: flex; align-items: center; justify-content: center; text-align: center; font-size: 20rpx; color: #999999; border: 1rpx solid #D2D2D2; padding: 10rpx 10rpx; box-sizing: border-box;"
|
|
:style="{color: index == 0 ? '#BB8520' : '#999999', border: `1rpx solid ${index == 0 ? '#F2C369' : '#D2D2D2'}`, 'background-color': (index == 0 ? '#FFFAF1' : '#FFFFFF')}"
|
|
v-for="(item,index) in ['经营现金流', '筹资现金流', '投资现金流']" :key="index">
|
|
{{item}}
|
|
</view>
|
|
</view>
|
|
|
|
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
|
<view class="flex1" style="font-size: 28rpx;">查看详细数据</view>
|
|
<view
|
|
style="color: #F2C369; font-size: 22rpx; padding: 2rpx 10rpx; border-radius: 5rpx; border: 1rpx solid #F2C369; text-align: center; margin: 0 10rpx;">
|
|
单季度</view>
|
|
<view
|
|
style="display: flex; align-items: center; padding: 3rpx 10rpx; box-sizing: border-box; border: 1rpx solid #D2D2D2;">
|
|
<image style="width: 23rpx; height: 23rpx;" src="/pagesStock/static/icon/all-icon.png"
|
|
mode="widthFix"></image>
|
|
<view style="margin: 0 10rpx; color: #999999; font-size: 22rpx;">全部</view>
|
|
<image style="width: 11rpx; height: 6rpx;" src="/pagesStock/static/icon/all-down.png"
|
|
mode="widthFix"></image>
|
|
</view>
|
|
</view>
|
|
|
|
<view
|
|
style="height: 400rpx; display: flex; align-items: center; justify-content: center; background-color: red;">
|
|
柱状折线图占位
|
|
</view>
|
|
|
|
<view style="background-color: #FAFAFC; border-radius: 10rpx; margin: 0 20rpx; padding: 20rpx 0;">
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">经营性现金流</view>
|
|
<view style="text-align: right; color: #2A2A2A;">3.50亿</view>
|
|
</view>
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">经营性现金流增长率</view>
|
|
<view style="text-align: right; color: #2A2A2A;">16.94%</view>
|
|
</view>
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">投资性现金流</view>
|
|
<view style="text-align: right; color: #2A2A2A;">-5544.90万</view>
|
|
</view>
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">筹资性现金流</view>
|
|
<view style="text-align: right; color: #2A2A2A;">-1.16亿</view>
|
|
</view>
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">合计现金流</view>
|
|
<view style="text-align: right; color: #2A2A2A;">1.79亿</view>
|
|
</view>
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">合计现金流增长率</view>
|
|
<view style="text-align: right; color: #2A2A2A;">935.58%</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 利润表 -->
|
|
<view @click="itemClick(2)" style="color: #2B2B2B; font-weight: 500; font-size: 24rpx;">
|
|
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
|
<image src="/pagesStock/static/icon/cwfx-1.png" mode="widthFix"
|
|
style="width: 40rpx; height: 40rpx;"></image>
|
|
<view class="flex1" style="margin: 0 10rpx; font-size: 28rpx;">利润表</view>
|
|
<image src="/static/icon/home/conceptCenter/next.png" mode="widthFix"
|
|
style="width: 13rpx; height: 22rpx;"></image>
|
|
</view>
|
|
|
|
<view style="display: grid; gap: 20rpx; grid-template-columns: repeat(3, 1fr); margin: 0 20rpx;">
|
|
<view
|
|
style="display: flex; align-items: center; justify-content: center; text-align: center; font-size: 20rpx; color: #999999; border: 1rpx solid #D2D2D2; padding: 10rpx 10rpx; box-sizing: border-box;"
|
|
:style="{color: index == 0 ? '#BB8520' : '#999999', border: `1rpx solid ${index == 0 ? '#F2C369' : '#D2D2D2'}`, 'background-color': (index == 0 ? '#FFFAF1' : '#FFFFFF')}"
|
|
v-for="(item,index) in ['净利润', '营业收入', '期间费用']" :key="index">
|
|
{{item}}
|
|
</view>
|
|
</view>
|
|
|
|
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
|
<view class="flex1" style="font-size: 28rpx;">查看详细数据</view>
|
|
<view
|
|
style="color: #F2C369; font-size: 22rpx; padding: 2rpx 10rpx; border-radius: 5rpx; border: 1rpx solid #F2C369; text-align: center; margin: 0 10rpx;">
|
|
单季度</view>
|
|
<view
|
|
style="display: flex; align-items: center; padding: 3rpx 10rpx; box-sizing: border-box; border: 1rpx solid #D2D2D2; margin-right: 10rpx;">
|
|
<image style="width: 23rpx; height: 23rpx;" src="/pagesStock/static/icon/all-icon.png"
|
|
mode="widthFix"></image>
|
|
<view style="margin: 0 10rpx; color: #999999; font-size: 22rpx;">全部</view>
|
|
<image style="width: 11rpx; height: 6rpx;" src="/pagesStock/static/icon/all-down.png"
|
|
mode="widthFix"></image>
|
|
</view>
|
|
<view
|
|
style="display: flex; align-items: center; padding: 3rpx 10rpx; box-sizing: border-box; border: 1rpx solid #D2D2D2;">
|
|
<image style="width: 23rpx; height: 23rpx;" src="/pagesStock/static/icon/all-icon.png"
|
|
mode="widthFix"></image>
|
|
<view style="margin: 0 10rpx; color: #999999; font-size: 22rpx;">汇总</view>
|
|
<image style="width: 11rpx; height: 6rpx;" src="/pagesStock/static/icon/all-down.png"
|
|
mode="widthFix"></image>
|
|
</view>
|
|
</view>
|
|
|
|
<view style="height: 400rpx;">
|
|
<l-echart ref="chartRef1"></l-echart>
|
|
</view>
|
|
|
|
<view style="background-color: #FAFAFC; border-radius: 10rpx; margin: 0 20rpx; padding: 20rpx 0;">
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">净利润</view>
|
|
<view style="text-align: right; color: #2A2A2A;">-6525.56万</view>
|
|
</view>
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">净利润增长率</view>
|
|
<view style="text-align: right; color: #2A2A2A;">-1600.69%</view>
|
|
</view>
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">营业总收入</view>
|
|
<view style="text-align: right; color: #2A2A2A;">3.64亿</view>
|
|
</view>
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">营业总收入增长率</view>
|
|
<view style="text-align: right; color: #2A2A2A;">-26.28%</view>
|
|
</view>
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">营业利润</view>
|
|
<view style="text-align: right; color: #2A2A2A;">-7539.55万</view>
|
|
</view>
|
|
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
|
<view style="flex: 1; color: #999999; margin-right: 20rpx;">营业利润增长率</view>
|
|
<view style="text-align: right; color: #2A2A2A;">-201.00%</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name:"cwsj-view",
|
|
data() {
|
|
return {
|
|
|
|
};
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style> |