提报

pages/submission/index.js

@@ -1,10 +1,21 @@
-// pages/submission/index.js
+const getHeight = require("../../utils/getRheRemainingHeight");
+const _Http = getApp().globalData.http;
+
 Page({
 
     /**
      * 页面的初始数据
      */
     data: {
+        listHeight: 0,
+        timeRangeShow: false,
+        whereType: {
+            value: "begdate",
+            list: {
+                "begdate": "",
+                "enddate": ""
+            }
+        },
         option1: [{
                 text: '所有日期',
                 value: '所有日期'
@@ -29,20 +40,68 @@ Page({
         ],
         value1: '所有日期',
         value2: '默认排序',
+        "content": {
+            "onceonly": 1,
+            pageNumber: 1,
+            pageSize: 20,
+            pageTotal: 1,
+            "where": {
+                "begdate": "",
+                "enddate": ""
+            }
+        },
     },
     /**
      * 生命周期函数--监听页面加载
      */
     onLoad(options) {
+        this.getList()
+    },
+    getList(init = false) {
+        if (init.detail != undefined) init = init.detail;
+        if (init) this.setData({
+            ['content.pageNumber']: 1
+        })
+        if (this.data.content.pageNumber > this.data.content.pageTotal) return;
+        _Http.basic({
+            "classname": "saletool.submitedit.submitedit",
+            "method": this.data.activeIndex == 2 ? "select_historylist" : "select_submitlist",
+            content: this.data.content
+        }).then(res => {
+            console.log("提报列表", res)
+            this.selectComponent('#ListBox').RefreshToComplete();
+            if (res.msg != '成功') return wx.showToast({
+                title: res.data,
+                icon: "none"
+            })
+            this.setData({
+                list: (res.pageNumber == 1) ? res.data : this.data.list.concat(res.data),
+                ['content.pageNumber']: res.pageNumber + 1,
+                ['content.pageTotal']: res.pageTotal,
+                total: res.total
+            })
+        })
     },
+    /* tabs切换 */
+    tabsClick({
+        detail
+    }) {
+        this.setData({
+            activeIndex: detail.index,
+            "content.onceonly": detail.index == 0 ? 1 : 0
+        });
+        this.getList(true)
+    },
+    /* 查看日期 */
     dropdownChange1({
         detail
     }) {
-        console.log(detail)
         this.setData({
-            value1: detail
+            value1: detail,
+            timeRangeShow: detail == "查看范围" ? true : false
         })
     },
+    /* 排序 */
     dropdownChange2({
         detail
     }) {
@@ -51,12 +110,58 @@ Page({
             value2: detail
         })
     },
-
+    /* 关闭时间范围选择 */
+    timeRangeClose() {
+        this.setData({
+            timeRangeShow: false,
+            "content.where": {
+                "begdate": "",
+                "enddate": ""
+            }
+        })
+    },
+    /* 查看所有日期 */
+    toSeeAll() {
+        this.setData({
+            value1: "所有日期"
+        })
+        this.timeRangeClose()
+    },
+    /* 选择日期类型 */
+    selectDateType(e) {
+        const {
+            name
+        } = e.target.dataset;
+        this.setData({
+            "whereType.value": name
+        })
+    },
+    /* 得到选择时间 */
+    getDate({
+        detail
+    }) {
+        let obj = this.data.whereType;
+        obj.list[obj.value] = detail;
+        this.setData({
+            whereType: obj
+        })
+    },
+    /* 确定时间范围 */
+    determineScope() {
+        this.setData({
+            "content.where": this.data.whereType.list
+        });
+        this.getList(true)
+    },
     /**
      * 生命周期函数--监听页面初次渲染完成
      */
     onReady() {
-
+        getHeight.getHeight('.dropdown', this).then(res => {
+            this.setData({
+                listHeight: res
+            })
+        });
     },
 
     /**

pages/submission/index.scss

@@ -1,6 +1,10 @@
 @import "../../static/unread.wxss";
 @import "../../components/My_card/index.scss";
 
+page {
+    padding-bottom: 0;
+}
+
 .item {
     padding: 20rpx 30rpx;
 
@@ -64,4 +68,54 @@
             }
         }
     }
+}
+
+.detePickerHeader {
+    position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 750rpx;
+    height: 100rpx;
+    padding: 0 30rpx;
+    box-sizing: border-box;
+
+    text {
+        font-size: 28rpx;
+        font-family: PingFang SC-Regular, PingFang SC;
+        color: var(--assist);
+    }
+
+    .type {
+        display: flex;
+        width: 384rpx;
+        height: 80rpx;
+        border: 1rpx solid var(--assist);
+        box-sizing: border-box;
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        transform: translate(-50%, -50%);
+        border-radius: 4rpx;
+        overflow: hidden;
+
+        .option {
+            height: 100%;
+            width: 50%;
+            padding: 10rpx 0 0 20rpx;
+            box-sizing: border-box;
+            font-size: 20rpx;
+            font-family: PingFang SC-Regular, PingFang SC;
+            color: var(--assist);
+
+            .time {
+                margin-top: 4rpx;
+            }
+        }
+
+        .active-op {
+            background-color: var(--assist);
+            color: #fff;
+        }
+    }
 }

pages/submission/index.wxml

@@ -1,29 +1,47 @@
-<van-tabs sticky color='var(--assist)' title-active-color='var(--assist)' title-inactive-color='#999'>
+<van-tabs sticky color='var(--assist)' title-active-color='var(--assist)' bind:click="tabsClick" title-inactive-color='#999'>
     <van-tab title="一事一报" />
     <van-tab title="一事多报" />
     <van-tab title="提报管理" />
 </van-tabs>
-<van-dropdown-menu active-color='var(--assist)'>
+<van-dropdown-menu active-color='var(--assist)' class="dropdown">
     <van-dropdown-item value="{{ value1 }}" options="{{ option1 }}" bindchange='dropdownChange1' />
     <van-dropdown-item value="{{ value2 }}" options="{{ option2 }}" bindchange='dropdownChange2' />
 </van-dropdown-menu>
-<view style="height: 50rpx;"></view>
-<My_datePicker></My_datePicker>
-<picker-view></picker-view>
-<view class="unread">总共15个，进行中10个，已过期5个</view>
-<navigator url="/pages/submission/details" class="my-card item" wx:for="{{5}}">
-    <view class="first-line">
-        <view class="line-1">标题标题标题标题抱标题标题标题标题抱团标题标题标题标题抱团团</view>
-        <text class="time">2022/05/18 09:21:20</text>
-    </view>
-    <view class="state">
-        <view class="explian">
-            <view>应提报：20</view>
-            <view>已提报：2</view>
+<My_listBox id='ListBox' height="{{listHeight}}" bind:getlist='getList'>
+    <view style="height: 10rpx;" />
+    <view class="unread">总共{{total}}个，进行中10个，已过期5个</view>
+    <navigator url="/pages/submission/details" class="my-card item" wx:for="{{5}}">
+        <view class="first-line">
+            <view class="line-1">标题标题标题标题抱标题标题标题标题抱团标题标题标题标题抱团团</view>
+            <text class="time">2022/05/18 09:21:20</text>
+        </view>
+        <view class="state">
+            <view class="explian">
+                <view>应提报：20</view>
+                <view>已提报：2</view>
+            </view>
+            <view class="but">
+                <van-button wx:if="{{activeIndex!=2}}" custom-class='read-but but-base' color="#FF3B30">未读</van-button>
+                <van-button custom-class='state-but but-base' color="#FA8C16">进行中</van-button>
+            </view>
         </view>
-        <view class="but">
-            <van-button custom-class='read-but but-base' color="#FF3B30">未读</van-button>
-            <van-button custom-class='state-but but-base' color="#FA8C16">进行中</van-button>
+    </navigator>
+</My_listBox>
+
+<van-action-sheet show="{{  timeRangeShow }}" bind:close='timeRangeClose'>
+    <view class="detePickerHeader">
+        <text catchtap="toSeeAll">所有日期</text>
+        <view class="type" catchtap="selectDateType">
+            <view class="option {{whereType.value=='begdate'?'active-op':''}}" data-name="begdate">
+                <view data-name="begdate">开始</view>
+                <view data-name="begdate" class="time">{{whereType.list.begdate||'开始时间'}}</view>
+            </view>
+            <view class="option {{whereType.value=='enddate'?'active-op':''}}" data-name="enddate">
+                <view data-name="enddate">结束</view>
+                <view data-name="enddate" class="time">{{whereType.list.enddate||'结束时间'}}</view>
+            </view>
         </view>
+        <text catchtap="determineScope">确定</text>
     </view>
-</navigator>
+    <My_datePicker bind:getDate='getDate' />
+</van-action-sheet>