add collection info

src/pages/collection/info/info.vue

@@ -3,9 +3,9 @@
         <view class="ci-header">
             <view class="ch-stadium">
                 <view class="cs-txt">当前门店</view>
-                <picker>
+                <picker :range="stadiumList" range-key="name" @change="storeChange">
                     <view class="cs-picker">
-                        <input disabled />
+                        <input :value="curStadium.name || '-'" disabled />
                         <image mode="aspectFit" src="/static/images/icon/arrow_b2.png"></image>
                     </view>
                 </picker>
@@ -15,9 +15,9 @@
                 <view class="cds-item">
                     <view class="ci-txt">日期</view>
                     <view class="ci-frame ci-date">
-                        <input />
+                        <input disabled :value="curDate || '-'" />
                         <view></view>
-                        <picker>
+                        <picker mode="date" @change="dateChange">
                             <image mode="aspectFit" src="/static/images/icon/calendar.png"></image>
                         </picker>
                         
@@ -26,9 +26,9 @@
                 <view class="cds-item">
                     <view class="ci-txt">场景</view>
                     <view class="ci-frame ci-scene">
-                        <picker class="cs-picker">
+                        <picker class="cs-picker" :range="sceneList" range-key="name" @change="sceneChange">
                             <view class="cp-picker-frame">
-                                <input disabled />
+                                <input disabled :value="curScene.name || '-'" />
                                 <image mode="aspectFit" src="/static/images/icon/arrow_b2.png" style="transform: rotateZ(90deg);"></image>
                             </view>
                         </picker>
@@ -38,11 +38,11 @@
             
         </view>
         <view class="ci-tab">
-            <view class="ct-item">
-                <view>全部</view>
+            <view class="ct-item" @click="curType = 0">
+                <view :class="[curType == 0?'active':'']">全部</view>
             </view>
-            <view class="ct-item">
-                <view class="active">退款</view>
+            <view class="ct-item" @click="curType = 1">
+                <view :class="[curType == 1?'active':'']">退款</view>
             </view>
         </view>
         <view class="ci-total">
@@ -68,8 +68,155 @@
 </template>
 
 <script>
+import { API } from '../../../js/api'
+import { servers } from '../../../js/server'
+import util from '../../../utils/util'
+import { mapState } from 'vuex';
 export default {
 
+    computed: {
+        ...mapState(['brandInfo']),
+    },
+    data(){
+        return {
+            optionsQuery: {},
+            stadiumList: [],
+            curStadium: {},
+            sceneList: [],
+            curScene: {},
+            curDate: '',
+            curType: 0, // 0 -> 全部, 1 -> 退款；
+
+            recordLs: [],
+            totalInfo: {},
+            page: 1
+        }
+    },
+    onLoad(options){
+        this.optionsQuery = options || {};
+
+        this.initPage(options);
+    },
+    methods: {
+        async initPage(options){
+            let _stadiumLs = await this.getStoreList(options.stadium_id);
+            let _sceneLs = await this.getSceneList();
+            let _date = this.curDate = util.formatDate({});
+            let _sid = options.stadium_id
+            this.getRecordLs({
+                brand_id: options.brand_id,
+                stadium_id: _sid,
+                time_str: _date,
+                scene: _sceneLs[0].scene,
+            })
+        },
+        refreshList(){
+            let { curStadium, optionsQuery, curScene, curDate, curType } = this;
+            
+        },
+        dateChange(e){
+            this.curDate = e.detail.value;
+
+        },
+        sceneChange(e){
+            let { sceneList } = this;
+            this.curScene = sceneList[e.detail.value];
+        },
+        async storeChange(e){
+            try{
+                util.showLoad();
+                // let { curDate, stadiumList } = this;
+                // await this.getRecordList({
+                //     stadium_id: stadiumList[e.detail.value].id || '',
+                //     date: `${curDate.year}-${curDate.month}`
+                // });
+                this.curStadium = stadiumList[e.detail.value] || {};
+                util.hideLoad();
+            }catch(err){
+                util.hideLoad();
+                console.warn('dateChange err',err)
+            }
+        },
+        getRecordLs({
+            brand_id,
+            stadium_id = '', // 空字符全部  -1品牌收款
+            time_str, // 日期y-m-d
+            scene,
+            type = '全部' , // 全部/退款
+            page_size = 15,
+            page = 1,
+        }){
+            let { optionsQuery } = this;
+            return servers.get({
+                url: API.consumeCountDetailLs,
+                data: {
+                    brand_id,
+                    stadium_id: stadium_id == 0 ? -1 : stadium_id == -2 ? '' : stadium_id,
+                    time_str,
+                    page,
+                    page_size,
+                    scene,
+                    type,
+                },
+                failMsg: '加载店铺列表失败！',
+
+            })
+            .then(res=>{
+                let _list = res.list || [];
+                this.totalInfo = res || {};
+                if(page == 1)return this.recordLs = _list;
+                if(!_list.length)return util.showNone('没有更多！');
+                this.page = page;
+                this.recordLs = [...this.recordLs, ..._list];
+                
+            })
+        },
+        // 店铺列表
+        getStoreList(stadium_id = ''){
+            let { optionsQuery } = this;
+            return servers.get({
+                url: API.stadiumList,
+                data: {
+                    brand_id: optionsQuery.brand_id,
+                },
+                failMsg: '加载店铺列表失败！',
+
+            })
+            .then(res=>{
+                let _list = res.list || [];
+                let _all = { name: '全部', id: -2, }
+                _list.unshift(_all);
+                let _cur = null;
+                if(!!stadium_id){
+                    let _fiLs = _list.filter(e=>e.id == stadium_id);
+                    if(_fiLs.length)_cur = _fiLs[0];
+                }
+                if(_cur&&_cur.id){
+                    this.curStadium = _cur;
+                }else if(!!+stadium_id){
+                    this.curStadium = _all;
+                }
+                return this.stadiumList = _list;
+            })
+        },
+        // 场景列表
+        getSceneList(){
+            let { optionsQuery } = this;
+            return servers.get({
+                url: API.consumeCountGetScene,
+                data: {
+                    key: 'consume_record_scene'
+                },
+                failMsg: '加载场景列表失败！',
+
+            })
+            .then(res=>{
+                let _list = res || [];
+                if(_list.length)this.curScene = _list[0]
+                return this.sceneList = _list;
+            })
+        },
+    }
 }
 </script>