75 lines
1.8 KiB
Vue
75 lines
1.8 KiB
Vue
![]() |
<template>
|
||
|
<div class="app-container">
|
||
|
<!-- 用户select选项 -->
|
||
|
<el-row :gutter="15" class="m-t-0">
|
||
|
<el-col :span="4">
|
||
|
<SelectionShopId class="w-100" v-model="shop_id" :allSel="true" />
|
||
|
</el-col>
|
||
|
<el-col :span="8">
|
||
|
<DatePickerOrder class="w-100" />
|
||
|
</el-col>
|
||
|
</el-row>
|
||
|
<!-- 统计标签 -->
|
||
|
<el-row :gutter="10" class="m-t-20">
|
||
|
<el-col :span="8">
|
||
|
<div class="statBox rad4 flex p-10">
|
||
|
<div class="flex3 flex mc column">
|
||
|
<div class="flex">
|
||
|
<div class="p-4 bg-white rad2 fc-b fb">成交额</div>
|
||
|
<div class="p-4 m-l-5">¥23441.44</div>
|
||
|
</div>
|
||
|
<div class="flex m-t-5">
|
||
|
<div class="p-4 bg-white rad2 fc-b fb">退款额</div>
|
||
|
<div class="p-4 m-l-5">¥23441.44</div>
|
||
|
</div>
|
||
|
<div class="flex m-t-5">
|
||
|
<div class="p-4 bg-white rad2 fc-b fb">订单总数</div>
|
||
|
<div class="p-4 m-l-5">18单</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="flex1 flex mc mac">
|
||
|
<div class="rad-c w-50px h-50px bg-white fb fc f-s-32 fc-b l-h-50">日</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</el-col>
|
||
|
</el-row>
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import SelectionShopId from '@/components/SelectionShopId.vue'
|
||
|
import DatePickerOrder from '@/components/DatePickerOrder.vue'
|
||
|
|
||
|
export default {
|
||
|
name: 'Stat',
|
||
|
data () {
|
||
|
return {
|
||
|
shop_id: '' // 搜索条件 商铺id
|
||
|
}
|
||
|
},
|
||
|
components: {
|
||
|
SelectionShopId,
|
||
|
DatePickerOrder
|
||
|
},
|
||
|
computed: {
|
||
|
|
||
|
},
|
||
|
methods: {
|
||
|
},
|
||
|
watch: {
|
||
|
},
|
||
|
created () {
|
||
|
}
|
||
|
}
|
||
|
</script>
|
||
|
|
||
|
<style lang="scss" scoped>
|
||
|
@import "@/styles/theme.scss";
|
||
|
|
||
|
.statBox {
|
||
|
background-color: $brand-color;
|
||
|
height: 30vh;
|
||
|
color: $white-color;
|
||
|
}
|
||
|
</style>
|