|
|
@@ -0,0 +1,183 @@
|
|
|
+<template>
|
|
|
+ <view class="stock-box" v-for="item in dataList" :key="item.stockCode">
|
|
|
+
|
|
|
+ <view class="stock-info">
|
|
|
+ <text class="stock-title">{{ item.stockShortName }}</text>
|
|
|
+ <text class="stock-code">{{ item.stockCode }}</text>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="line"></view>
|
|
|
+
|
|
|
+ <view class="stock-details">
|
|
|
+ <view class="detail-item">
|
|
|
+ <text class="label">申购日期</text>
|
|
|
+ <text class="value">{{ item.subscriptionDate }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="detail-item">
|
|
|
+ <text class="label">发行价格</text>
|
|
|
+ <text class="value">{{ item.issuePrice }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="line"></view>
|
|
|
+
|
|
|
+ <view class="stsock-detail-exts">
|
|
|
+ <view class="detail-item">
|
|
|
+ <view class="label">市盈率(倍)</view>
|
|
|
+ <text class="value">{{ item.issuePeRatio }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="detail-item">
|
|
|
+ <view class="label">行业市盈率(倍)</view>
|
|
|
+ <text class="value">{{ item.industryPeRatio }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="detail-item">
|
|
|
+ <view class="label">总发行数量</view>
|
|
|
+ <text class="value">{{ item.totalIssued }}股</text>
|
|
|
+ </view>
|
|
|
+ <view class="detail-item">
|
|
|
+ <view class="label">网上发行数量</view>
|
|
|
+ <text class="value">{{ item.onlineIssued }}股</text>
|
|
|
+ </view>
|
|
|
+ <view class="detail-item">
|
|
|
+ <view class="label">网上申购数量</view>
|
|
|
+ <text class="value">{{ item.subscriptionLimit }}股</text>
|
|
|
+ </view>
|
|
|
+ <view class="detail-item">
|
|
|
+ <view class="label">顶格申购需市值</view>
|
|
|
+ <text class="value">{{ item.maxMarketValueForSubscription }}股</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { ref } from 'vue';
|
|
|
+import { onPullDownRefresh, onShow, onLoad } from "@dcloudio/uni-app";
|
|
|
+import { dataApi } from '@/apis/apis.js';
|
|
|
+
|
|
|
+// 属性
|
|
|
+/**
|
|
|
+ * 申购日期
|
|
|
+ */
|
|
|
+const subscriptionDate = ref(null);
|
|
|
+
|
|
|
+/**
|
|
|
+ * 数据列表
|
|
|
+ */
|
|
|
+const dataList = ref([]);
|
|
|
+
|
|
|
+
|
|
|
+// 方法
|
|
|
+/**
|
|
|
+ * 加载数据
|
|
|
+ */
|
|
|
+const loadData = async () => {
|
|
|
+ dataList.value = await dataApi.queryIpoStock({
|
|
|
+ "subscriptionDate": subscriptionDate.value,
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
+// 生命周期
|
|
|
+onLoad((e) => {
|
|
|
+ if (e.subscriptionDate) {
|
|
|
+ subscriptionDate.value = e.subscriptionDate;
|
|
|
+ loadData();
|
|
|
+ }
|
|
|
+});
|
|
|
+
|
|
|
+onShow(() => {
|
|
|
+ loadData();
|
|
|
+});
|
|
|
+
|
|
|
+onPullDownRefresh(() => {
|
|
|
+ loadData();
|
|
|
+ uni.stopPullDownRefresh();
|
|
|
+});
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.stock-box {
|
|
|
+
|
|
|
+ padding: 16rpx 24rpx;
|
|
|
+ background-color: #ffffff;
|
|
|
+
|
|
|
+ .stock-info {
|
|
|
+
|
|
|
+ .stock-title {
|
|
|
+ font-size: 36rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ letter-spacing: 0rpx;
|
|
|
+ line-height: 52.13rpx;
|
|
|
+ color: #000000;
|
|
|
+ text-align: left;
|
|
|
+ vertical-align: top;
|
|
|
+ }
|
|
|
+
|
|
|
+ .stock-code {
|
|
|
+ margin-left: 16rpx;
|
|
|
+
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ letter-spacing: 0rpx;
|
|
|
+ line-height: 34.75rpx;
|
|
|
+ color: #6A6A6A;
|
|
|
+ text-align: left;
|
|
|
+ vertical-align: bottom;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .line {
|
|
|
+ margin-top: 16rpx;
|
|
|
+ margin-bottom: 16rpx;
|
|
|
+ border: 1px solid #F0F0F0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .stock-details {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+
|
|
|
+ .detail-item {
|
|
|
+ width: 50%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .stsock-detail-exts {
|
|
|
+ .detail-item {
|
|
|
+ .label {
|
|
|
+ width: 200rpx;
|
|
|
+ display: inline-block
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .stock-details,
|
|
|
+ .stsock-detail-exts {
|
|
|
+
|
|
|
+ .detail-item {
|
|
|
+ margin-bottom: 12rpx;
|
|
|
+
|
|
|
+ .label {
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ letter-spacing: 0rpx;
|
|
|
+ line-height: 34.75rpx;
|
|
|
+ color: #6a6a6a;
|
|
|
+ text-align: left;
|
|
|
+ vertical-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .value {
|
|
|
+ margin-left: 24rpx;
|
|
|
+
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ letter-spacing: 0rpx;
|
|
|
+ line-height: 34.75rpx;
|
|
|
+ color: #000000;
|
|
|
+ text-align: left;
|
|
|
+ vertical-align: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|