|
|
@@ -0,0 +1,280 @@
|
|
|
+<template>
|
|
|
+ <view class="ex-page">
|
|
|
+ <view class="top-bar">
|
|
|
+ <DorpdownSelect class="bar"
|
|
|
+ :menuObj="menuTimeObj"
|
|
|
+ :selectItemId.sync="selectTimeId"
|
|
|
+ :typeSelect="1" top="0px"
|
|
|
+ @selectSussess="selectSussess" />
|
|
|
+
|
|
|
+ <DorpdownSelect class="bar"
|
|
|
+ :menuObj.sync="menuObj"
|
|
|
+ :selectItemId.sync="shopId"
|
|
|
+ top="0"
|
|
|
+ @selectSussess="selectShopSussess" />
|
|
|
+ </view>
|
|
|
+ <scroll-view scroll-y scroll-with-animation class="main-view">
|
|
|
+ <view class="space-view ex-table">
|
|
|
+ <block v-if="!$util.isEmpty(list.data)">
|
|
|
+ <t-table :headerBackgroundColor="'#F0F2F6'">
|
|
|
+ <t-tr header>
|
|
|
+ <t-th v-for="(item, index) in columns" :key="index" :align="item.align">
|
|
|
+ {{ item.name }}
|
|
|
+ </t-th>
|
|
|
+ </t-tr>
|
|
|
+ <t-tr v-for="(item, index) in list.data" :key="index">
|
|
|
+ <t-td v-for="(column, colIndex) in columns" :key="colIndex" :align="column.align" :color="column.color">
|
|
|
+ <view>
|
|
|
+ {{ item[column.dataIndex] || "" }}
|
|
|
+ </view>
|
|
|
+ </t-td>
|
|
|
+ </t-tr>
|
|
|
+ </t-table>
|
|
|
+ </block>
|
|
|
+ <block v-else>
|
|
|
+ <AppWrapperEmpty title="暂无记录" :is-empty="$util.isEmpty(list.data)" />
|
|
|
+ </block>
|
|
|
+ </view>
|
|
|
+ </scroll-view>
|
|
|
+ <!-- 时间段选择-->
|
|
|
+ <rangeDatePick
|
|
|
+ :show="isShow"
|
|
|
+ start="2000-01-01"
|
|
|
+ end="2200-12-01"
|
|
|
+ :value="customizationTime"
|
|
|
+ @change="timeChange"
|
|
|
+ @cancel="timeCancel"
|
|
|
+ themeColor="#4C83D6" fields="day"></rangeDatePick>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+const Month = (new Date().getMonth()+1)<10?'0'+(new Date().getMonth()+1):new Date().getMonth()+1
|
|
|
+const time = `${new Date().getFullYear()}-${Month}-${new Date().getDate()}`;
|
|
|
+import AppWrapperEmpty from "@/components/app-wrapper-empty";
|
|
|
+
|
|
|
+import SelectList from "@/components/plugin/selectList";
|
|
|
+import { getStatYj } from "@/api/statistics/index";
|
|
|
+import { list,selectShop } from "@/mixins";
|
|
|
+import DorpdownSelect from "@/components/module/dorpdownSelect";
|
|
|
+import rangeDatePick from '@/components/pyh-rdtpicker/pyh-rdtpicker.vue';
|
|
|
+import {mapActions, mapGetters} from "vuex";
|
|
|
+export default {
|
|
|
+ components: { SelectList, AppWrapperEmpty,DorpdownSelect,rangeDatePick },
|
|
|
+ mixins: [list,selectShop],
|
|
|
+ computed: { ...mapGetters(["getDictionariesInfo","getLoginInfo"]) },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ isShow:false,
|
|
|
+ customizationTime:'',
|
|
|
+ menuTimeObj:'',//时间分类-类型
|
|
|
+ menuShopObj:'',//门店分类-类型
|
|
|
+ selectTimeId:'',//选择时间id
|
|
|
+ shopId:'',//选择分店id
|
|
|
+ itemId:'',
|
|
|
+ selectListData: [
|
|
|
+ {
|
|
|
+ title: "时间",
|
|
|
+ key: "time",
|
|
|
+ default: "1",
|
|
|
+ data: [
|
|
|
+ {
|
|
|
+ name: "下午",
|
|
|
+ value: "1"
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "全部",
|
|
|
+ key: "shopId",
|
|
|
+ default: "01",
|
|
|
+ data: [
|
|
|
+ {
|
|
|
+ name: "瑞景店",
|
|
|
+ value: "01"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "加州店",
|
|
|
+ value: "02"
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ nowTime: "",
|
|
|
+ showTimeDropdown: false,
|
|
|
+ nowShop: "",
|
|
|
+ showShopDropdown: false,
|
|
|
+ columns: [
|
|
|
+ {
|
|
|
+ name: "姓名",
|
|
|
+ dataIndex: "adminName",
|
|
|
+ color: "info"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "开单额",
|
|
|
+ dataIndex: "amount",
|
|
|
+ color: "info",
|
|
|
+ width: 120,
|
|
|
+ align: "center"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "开单数",
|
|
|
+ dataIndex: "num",
|
|
|
+ color: "info",
|
|
|
+ align: "center"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ dataList: [],
|
|
|
+ params:{
|
|
|
+ itemId: '',
|
|
|
+ searchTime:'',
|
|
|
+ startTime: "",
|
|
|
+ endTime: "",
|
|
|
+ shopId: "",
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onPullDownRefresh() {
|
|
|
+ this.resetList();
|
|
|
+ this._list().then(res => {
|
|
|
+ uni.stopPullDownRefresh();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ onLoad(e) {
|
|
|
+ this.itemId = e.id;
|
|
|
+ this.params.itemId = e.id;
|
|
|
+
|
|
|
+ let dateDefaultOption = [];
|
|
|
+ let list = this.getDictionariesInfo.dateDefaultOption;
|
|
|
+ for (let i=0;i<list.length;i++){
|
|
|
+ dateDefaultOption.push({name:list[i].name,id:list[i].value})
|
|
|
+ }
|
|
|
+ this.menuTimeObj = {title:'时间',titleChild:'时间',list: dateDefaultOption};
|
|
|
+
|
|
|
+ this.shopId = this.getLoginInfo.shopId;
|
|
|
+ console.log(' this.selectShopId',this.shopId)
|
|
|
+ console.log(' this.getLoginInfo.shopId',this.getLoginInfo.shopId)
|
|
|
+ this.init();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ ...mapActions(['setUserShopAll']),
|
|
|
+ // 选择分店
|
|
|
+ selectShopSussess(val){
|
|
|
+ this.params.shopId = val.selectItem.id;
|
|
|
+ this.init();
|
|
|
+ },
|
|
|
+ //选择时间
|
|
|
+ selectSussess(val) {
|
|
|
+ this.params.selectTime = this.selectTimeId;
|
|
|
+ if(val.select=='自定义'){
|
|
|
+ this.selectTime();
|
|
|
+ }else{
|
|
|
+ this.init();
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ //选择时间-自定义时间
|
|
|
+ selectTime(){
|
|
|
+ this.customizationTime = [time,time],
|
|
|
+ this.isShow = true;
|
|
|
+ },
|
|
|
+ //选择自定义时间确定
|
|
|
+ timeChange(e){
|
|
|
+ this.isShow = false;
|
|
|
+ this.params.startTime = e[0]
|
|
|
+ this.params.endTime = e[1]
|
|
|
+ this.init();
|
|
|
+ },
|
|
|
+ //选择自定义时间取消
|
|
|
+ timeCancel(e){this.isShow = false;},
|
|
|
+
|
|
|
+ async init() {
|
|
|
+ this._list();
|
|
|
+ },
|
|
|
+ _list() {
|
|
|
+ return getStatYj(this.params).then(res => {
|
|
|
+ this.completes(res);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.ex-page {
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ .top-bar {
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ display: flex;
|
|
|
+ width: 100%;
|
|
|
+ // box-shadow: 0 5upx 5upx 5upx rgba($color: #000000, $alpha: 0.2);
|
|
|
+ z-index: 20;
|
|
|
+ .bar{
|
|
|
+ width: 50%;
|
|
|
+ height: 100%;
|
|
|
+ text-align: center;
|
|
|
+ &:nth-child(1){
|
|
|
+ border-right: 1px solid #eeeeec;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .main-view {
|
|
|
+ margin-top: 80upx;
|
|
|
+ flex: 1;
|
|
|
+ background-color: #f9fbfc;
|
|
|
+ .space-view {
|
|
|
+ background-color: #fff;
|
|
|
+ }
|
|
|
+ .ex-info {
|
|
|
+ padding: 30upx;
|
|
|
+ .info-cell {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 28upx;
|
|
|
+ &:not(:first-child) {
|
|
|
+ margin-top: 20upx;
|
|
|
+ }
|
|
|
+ .cell-label {
|
|
|
+ width: 110upx;
|
|
|
+ color: #666666;
|
|
|
+ }
|
|
|
+ .cell-value {
|
|
|
+ margin-left: 40upx;
|
|
|
+ color: #333;
|
|
|
+ &.warning {
|
|
|
+ color: #ffaf1d;
|
|
|
+ }
|
|
|
+ &.success {
|
|
|
+ color: #27c325;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .ex-table {
|
|
|
+ /deep/.icon-info {
|
|
|
+ color: #333333;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .bar-view {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ padding: 0 30upx;
|
|
|
+ width: 100%;
|
|
|
+ height: 100upx;
|
|
|
+
|
|
|
+ box-shadow: 0px -1px 6px 0px rgba(4, 0, 0, 0.06);
|
|
|
+ .info-view {
|
|
|
+ font-size: 26upx;
|
|
|
+ }
|
|
|
+ .btn-view {
|
|
|
+ display: flex;
|
|
|
+ .admin-button-com {
|
|
|
+ margin: 0 10upx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
shish