| | |
| | | <template> |
| | | <el-drawer |
| | | :title="$t('hj2')" |
| | | :visible.sync="dialogVisible" |
| | | direction="rtl" |
| | | :before-close="onClose" |
| | | size="980px" |
| | | > |
| | | <el-drawer :title="$t('hj2')" :visible.sync="dialogVisible" direction="rtl" :before-close="onClose" size="980px"> |
| | | <div class="drawer-content"> |
| | | <div class="card sb_b"> |
| | | <div class="card_1 flex-center"> |
| | | <div>{{ $t("浮動盈虧") }}</div> |
| | | <div |
| | | style="font-size: 24px" |
| | | :style="`color:${ |
| | | thisMoneyData.profitAndLoss > 0 |
| | | ? 'red' |
| | | : thisMoneyData.profitAndLoss < 0 |
| | | <div style="font-size: 24px" :style="`color:${thisMoneyData.profitAndLoss > 0 |
| | | ? 'red' |
| | | : thisMoneyData.profitAndLoss < 0 |
| | | ? 'green' |
| | | : '' |
| | | }`" |
| | | > |
| | | }`"> |
| | | {{ thisMoneyData.symbol }} {{ thisMoneyData.profitAndLoss }} |
| | | </div> |
| | | </div> |
| | |
| | | </div> |
| | | </div> |
| | | <div class="card_2_item flex-center" style="align-items: end"> |
| | | <div>{{ $t("账户盈亏") }}</div> |
| | | <div>{{ $t("平仓盈亏") }}</div> |
| | | <div> |
| | | {{ thisMoneyData.symbol |
| | | }}{{ thisMoneyData.cumulativeProfitAndLoss }} |
| | |
| | | </div> |
| | | </div> |
| | | |
| | | <el-table |
| | | :data="tableData" |
| | | style="width: 100%; flex: 1" |
| | | height="100%" |
| | | empty-text="No Data" |
| | | > |
| | | <el-table :data="tableData" style="width: 100%; flex: 1" height="100%" empty-text="No Data"> |
| | | <el-table-column prop="stockSpell" :label="$t('hj313')"> |
| | | <template slot-scope="scope"> |
| | | <el-tag |
| | | :type="scope.row.stockGid != $mc ? 'success' : ''" |
| | | size="small" |
| | | style="margin-right: 8px" |
| | | > |
| | | <el-tag :type="scope.row.stockGid != $mc ? 'success' : ''" size="small" style="margin-right: 8px"> |
| | | {{ scope.row.stockGid }} |
| | | </el-tag> |
| | | <span>{{ scope.row.stockName }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | |
| | | <el-table-column |
| | | prop="positionType" |
| | | :label="`${$t('hj313')} ${$t('類型')}`" |
| | | > |
| | | <el-table-column prop="positionType" :label="`${$t('hj313')} ${$t('類型')}`"> |
| | | <template slot-scope="scope"> |
| | | <el-tag type="warning"> |
| | | {{ dictionary.gplx[scope.row.positionType] }} |
| | |
| | | |
| | | <el-table-column prop="profitAndLoseParent" :label="$t('Profit')"> |
| | | <template slot-scope="scope"> |
| | | <span |
| | | :class="`${ |
| | | scope.row.profitAndLose < 0 |
| | | ? 'r_c' |
| | | : scope.row.profitAndLose > 0 |
| | | <span :class="`${scope.row.profitAndLose < 0 |
| | | ? 'r_c' |
| | | : scope.row.profitAndLose > 0 |
| | | ? 'lc_c' |
| | | : '' |
| | | }`" |
| | | > |
| | | }`"> |
| | | {{ scope.row.profitAndLose }} ({{ |
| | | scope.row.profitAndLoseParent |
| | | }}) |
| | |
| | | </el-table> |
| | | |
| | | <div class="pagination flex-end"> |
| | | <el-pagination |
| | | background |
| | | layout="prev, pager, next" |
| | | :total="total" |
| | | :current-page="pageNum" |
| | | :page-size="pageSize" |
| | | @current-change="handleCurrentChange" |
| | | > |
| | | <el-pagination background layout="prev, pager, next" :total="total" :current-page="pageNum" |
| | | :page-size="pageSize" @current-change="handleCurrentChange"> |
| | | </el-pagination> |
| | | </div> |
| | | </div> |
| | |
| | | border-radius: 16px; |
| | | overflow: hidden; |
| | | border: 1px solid #777; |
| | | |
| | | .card_1 { |
| | | padding: 20px; |
| | | font-size: 18px; |
| | | flex-direction: column; |
| | | } |
| | | |
| | | .card_2 { |
| | | width: 100%; |
| | | padding: 10px 30px 10px; |
| | | |
| | | .card_2_item { |
| | | width: 33%; |
| | | flex-direction: column; |
| | | & > div { |
| | | |
| | | &>div { |
| | | padding: 3px 0; |
| | | } |
| | | } |