105 lines
1.9 KiB
Vue
105 lines
1.9 KiB
Vue
<template>
|
|
|
|
<div class="container">
|
|
<div class="tab-box">
|
|
<div class="f-box" v-for="(item,index) in tablist" :key="index" @click="activeindex=index" :class="{ 'active' :activeindex==index}">{{item.name}}</div>
|
|
</div>
|
|
<handover-record-trading v-if="activeindex == '0'" :staffId="staffId" :btime="btime" :etime="etime" ></handover-record-trading>
|
|
<handover-record-ref v-if="activeindex == '1'" :staffId="staffId" :btime="btime" :etime="etime"></handover-record-ref>
|
|
|
|
</div>
|
|
|
|
|
|
</template>
|
|
|
|
<script>
|
|
|
|
|
|
import HandoverRecordTrading from "@/views/handover/info/rec/trading.vue";
|
|
import HandoverRecordRef from "@/views/handover/info/rec/ref.vue";
|
|
|
|
export default {
|
|
name: "buy-list",
|
|
props:['staffId','btime','etime'],
|
|
data() {
|
|
return {
|
|
radio1: '交易明细',
|
|
activeindex: 0,
|
|
tablist: [
|
|
{
|
|
name: '交易明细',
|
|
},
|
|
{
|
|
name: '退款明细',
|
|
},
|
|
]
|
|
}
|
|
},
|
|
components: {
|
|
HandoverRecordRef,
|
|
HandoverRecordTrading,
|
|
},
|
|
created() {
|
|
console.log("aaa",this.staffId)
|
|
console.log("aaa",this.btime)
|
|
console.log("aaa",this.etime)
|
|
},
|
|
methods: {
|
|
handleClick(tab, event) {
|
|
console.log(tab, event);
|
|
}
|
|
}
|
|
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.app-center {
|
|
width: 100%;
|
|
|
|
box-sizing: border-box;
|
|
padding: 10px;
|
|
}
|
|
|
|
.app-top {
|
|
width: 100%;
|
|
margin-bottom: 20px;
|
|
height: 60px;
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
|
|
.tab-box {
|
|
width: 100%;
|
|
background: #fff;
|
|
display: flex;
|
|
box-sizing: border-box;
|
|
padding: 0px 50px;
|
|
border-top: 1px solid #eceff1;
|
|
}
|
|
|
|
.f-box {
|
|
height: 40px;
|
|
color: #999999;
|
|
margin-right: 50px;
|
|
display: flex;
|
|
align-items: center;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.active {
|
|
color: #FF9655 !important;
|
|
border-bottom: 2px solid #FF9655 !important;
|
|
}
|
|
|
|
.container {
|
|
background: #F4F5F9;
|
|
box-sizing: border-box;
|
|
//padding: 20px;
|
|
}
|
|
|
|
.tabder-box {
|
|
width: 85%;
|
|
}
|
|
</style>
|