<template>
    <view class="main">
        <!-- nav -->
        <navigation>{{ 'BTC/USDT' }}<view slot="right" class="right" @click="goto('kLine')"></view>
        </navigation>
        <view class="content">
            <view class="transactionSide">
                <!-- <tradePanel ref="trade" :type="type"></tradePanel> -->
                <transaction></transaction>
            </view>
            <view class="positionSide">
                <!-- <positionList v-on:depthChange="depthChange"></positionList> -->
            </view>
        </view>
        <view class="uni-gap"></view>
        <!-- <entrustOrderList></entrustOrderList> -->
        <!-- <uni-drawer :visible="drawerVisible" mask="false" mode="left" @close="closeDrawer">
            <marketDrawer :areaList="areaList" :marketList="marketList"></marketDrawer>
        </uni-drawer> -->

    </view>
</template>

<script>
import transaction from '../../components/transaction/transaction.vue';
export default {
  components: { transaction },
    name: "trade",
    data() {
        return {

        };
    },
    computed: {
        i18n() {
            return this.$t("markets");
        },
    },
    onLoad() {

    },
    onShow() { },
    methods: {
        

    },
}
</script>

<style lang="scss" scoped>
.main {

    .right {
        width: 48rpx;
        height: 48rpx;
        position: absolute;
        right: 32rpx;
        font-size: 24rpx;
        background-image: url(../../static/home/ic_increase.png);
        background-repeat: no-repeat;
        background-size: 48rpx;
        color: #FFBC1F;
    }


    .content {
        margin-top: 200rpx;
        padding: 40rpx;

        .transactionSide{
            width: 444rpx;
            margin-left: 28rpx;
        }


    }




}
</style>
