修改日计划，我的待办，等相应bug

付延余

2022-08-23 a88092021b14abc67c2f2e53ce722d609632aeb5

 pages/my-have-todo/my-have-todo.vue

@@ -1,103 +1,115 @@
<template>
   <view class="my-have-todo">
      <!-- 搜索区域 -->
      <view class="searchBox">
         <view class="search">
            <u-search @clickIcon="searchIconClick" :clearabled="false" :showAction="false" placeholder="请输入标题" v-model="searchData" shape="square"></u-search>
         </view>
         <!-- 状态选择器 -->
         <view class="data-selet" @click="statusSeletShow = true">
            <view class="content">
               <text>{{ dataSeletText }}</text>
            </view>
            <view class="uni-select__icon"><image src="@/static/icon/select.png" mode="加载失败"></image></view>
         </view>
      </view>
      <view class="searchContainer">
         <u-collapse :border="true" @change="searchChange" @close="searchClose" @open="searchOpen">
            <u-collapse-item :border="false" title="搜索框" name="Docs guide">
               <view class="searchBox">
                  <view class="search"><u-search :clearabled="true" :showAction="false" placeholder="请输入标题" v-model="haveTodoParams.title" shape="square"></u-search></view>
                  <!-- 状态选择器 -->
                  <!-- <view class="data-selet" @click="statusSeletShow = true">
              <view class="content">
                <text>{{ dataSeletText }}</text>
              </view>
              <view class="uni-select__icon"><image src="@/static/icon/select.png" mode="加载失败"></image></view>
            </view> -->
                  <view class="search"><u-search :clearabled="true" :showAction="false" placeholder="请输入任务名称" v-model="haveTodoParams.name" shape="square"></u-search></view>
               </view>

      <!-- 时间搜索区域 -->
      <view class="timeContiner">
         <uni-datetime-picker class="time-picker" type="date" :clear-icon="false" v-model="createTime" @change="startDateChange" placeholder="开始时间" />
         <uni-datetime-picker class="time-picker" type="date" :clear-icon="false" v-model="endTime" @change="endDateChange" placeholder="结束时间" />
      </view>
               <!-- 时间搜索区域 -->
               <view class="timeContiner">
                  <uni-datetime-picker class="time-picker" type="date" :clear-icon="true" v-model="haveTodoParams.startDate" @change="startDateChange" placeholder="开始时间" />
                  <uni-datetime-picker class="time-picker" type="date" :clear-icon="true" v-model="haveTodoParams.endDate" @change="endDateChange" placeholder="结束时间" />
               </view>

               <view class="searchButton">
                  <u-button type="primary" text="搜索" @click="searchButtonClick"></u-button>
                  <u-button type="primary" :plain="true" text="清空" @click="emptyButtonClick"></u-button>
               </view>
            </u-collapse-item>
         </u-collapse>
      </view>
      <!-- 我的已办卡片区域 -->
      <u-checkbox-group v-model="checkBoxValue" placement="column" @change="checkboxChange" style="margin-bottom:50px">
      <combination-card v-for="(item, index) in yibanData" index="index">
         <template v-slot:top>
            <u-checkbox size="35" :key="item.id" :name="item.id"></u-checkbox>
            <view>
               <text>{{ item.actBusiness.title }}</text>
            </view>
         </template>
         <template v-slot:center>
            <view class="center-container">
               <view class="center-content__one center-margin">
                  <view>
                     <text>任务名称：{{ item.name }}</text>
      <view class="cardCheckGroup">
         <u-checkbox-group v-model="checkBoxValue" placement="column" @change="checkboxChange" style="margin-bottom:50px">
            <combination-card v-for="(item, index) in yibanData" index="index">
               <template v-slot:top>
                  <view class="yibanTop">
                     <u-checkbox size="30" iconSize="18" :key="item.id" :name="item.id"></u-checkbox>
                     <text>{{ item.actBusiness.title }}</text>
                  </view>
                  <view>
                     <text>所属流程：{{ item.processName }}</text>
               </template>
               <template v-slot:center>
                  <view class="center-container">
                     <view class="center-content__one center-margin">
                        <view>
                           <text>任务名称：{{ item.name }}</text>
                        </view>
                        <view>
                           <text>所属流程：{{ item.processName }}</text>
                        </view>
                     </view>
                     <view class="center-content__two center-margin">
                        <view>
                           <text>发起人：{{ item.actBusiness.createByName }}</text>
                        </view>
                        <view>
                           <text>审批操作：{{ item.deleteReason }}</text>
                        </view>
                     </view>
                     <view class="center-content__three center-margin">
                        <view class="">
                           <text>审批意见：{{ item.comment == 'undefined' ? '' : item.comment || '' }}</text>
                        </view>
                        <view class="">
                           <text>
                              耗时：{{
                                 item.duration >= 86400000
                                    ? parseInt(item.duration / 86400000 + '天' + parseInt(item.duration % 86400000) / 3600000 + '时' + parseInt(item.duration % 3600000) / 60000 + '分')
                                    : item.duration >= 3600000
                                    ? parseInt(item.duration / 3600000) + '时' + parseInt((item.duration / 3600000) % 3600000) + '分'
                                    : parseInt(item.duration / 60000) + '分'
                              }}
                           </text>
                        </view>
                     </view>
                     <view class="center-content__four">
                        <text>创建时间：{{ item.createTime }}</text>
                     </view>
                  </view>
               </view>
               <view class="center-content__two center-margin">
                  <view>
                     <text>发起人：{{ item.actBusiness.createByName }}</text>
               </template>
               <template v-slot:bottom>
                  <view class="bottom-container">
                     <!-- 已办按钮 -->
                     <view class="bottom-content__item">
                        <view @click="theFormDataClick(item.tableId)" v-if="item.procDefId == 'WAY_BILL:4:87504'">
                           <image src="@/static/home/biaodan.png" mode=""></image>
                           <view>申请详情</view>
                        </view>
                        <view @click="approvalHistoryClick(item.procInstId)">
                           <image src="@/static/home/history.png" mode=""></image>
                           <view>审批历史</view>
                        </view>
                        <view @click="deleteApplicationClick(item.id)">
                           <image src="@/static/home/delete.png" mode=""></image>
                           <view>删除</view>
                        </view>
                     </view>
                  </view>
                  <view>
                     <text>审批操作：{{ item.deleteReason }}</text>
                  </view>
               </view>
               <view class="center-content__three center-margin">
                  <view class="">
                     <text>审批意见：{{ item.comment }}</text>
                  </view>
                  <view class="">
                     <text>耗时：{{
                           item.duration >= 86400000
                              ? parseInt(item.duration / 86400000 + '天' + parseInt(item.duration % 86400000) / 3600000 + '时' + parseInt(item.duration % 3600000) / 60000 + '分')
                              : item.duration >= 3600000
                              ? parseInt(item.duration / 3600000) + '时' + parseInt(item.duration / 3600000 % 3600000)  + '分'
                              : parseInt(item.duration / 60000) + '分'
                        }}</text>
                  </view>
               </view>
               <view class="center-content__four">
                  <text>创建时间：{{ item.createTime }}</text>
               </view>
            </view>
         </template>
         <template v-slot:bottom>
            <view class="bottom-container">
               <!-- 已办按钮 -->
               <view class="bottom-content__item">
                  <view @click="theFormDataClick">
                     <image src="@/static/home/biaodan.png" mode=""></image>
                     <view>表单数据</view>
                  </view>
                  <view @click="approvalHistoryClick">
                     <image src="@/static/home/history.png" mode=""></image>
                     <view>审批历史</view>
                  </view>
                  <view @click="deleteApplicationClick(item.id)">
                     <image src="@/static/home/delete.png" mode=""></image>
                     <view>删除</view>
                  </view>
               </view>
            </view>
         </template>
      </combination-card>
      </u-checkbox-group>

               </template>
            </combination-card>
         </u-checkbox-group>
      </view>
      <!-- 底部全选 -->
      <view class="bottomTabbar">
         <view class="bottomTabbar_checkBox">
            <u-checkbox-group size="35" v-model="totalSelectValue" placement="column" @change="totalSelectChange"><u-checkbox labelSize="13px" label="全选" name="tatalSelect"></u-checkbox></u-checkbox-group>
            <u-checkbox-group size="35" iconSize="18" v-model="totalSelectValue" placement="column" @change="totalSelectChange">
               <u-checkbox labelSize="13px" label="全选" name="tatalSelect"></u-checkbox>
            </u-checkbox-group>
         </view>
         <view class="bottomTabbar_button">
            <u-button :plain="true" type="primary"  text="批量删除" @click="deleteApplicationClick()"></u-button>
         </view>
         <view class="bottomTabbar_button"><u-button :plain="true" type="primary" text="批量删除" @click="deleteApplicationClickAll()"></u-button></view>
      </view>
		

      <!-- 删除已办申请模态框 -->
      <view class="deleteApplicationModal">
         <u-modal
@@ -111,8 +123,11 @@
      </view>

      <!-- 选择器 -->
      <u-picker @cancel="statusSeletShow = false" @confirm="statusConfirm" :show="statusSeletShow" :columns="statusList"></u-picker>
		
      <!-- <u-picker @cancel="statusSeletShow = false" @confirm="statusConfirm" :show="statusSeletShow" :columns="statusList"></u-picker> -->

      <!--返回顶部-->
      <view class="back-top-container"><u-back-top :scroll-top="scrollTop"></u-back-top></view>

      <!-- 菜单栏 -->
      <popup-menu @menuShow="menushow" ref="menuRef"></popup-menu>
   </view>
@@ -121,116 +136,249 @@
<script>
import popupMenu from '@/components/common/popup-menu/popup-menu.vue';
import combinationCard from '@/components/common/combination-card/combination-card.vue';

export default {
   data() {
      return {
         scrollTop: 0,
         // 条件搜索
         searchData: '',
         dataSeletText: '请选择状态',
         // searchData: '',
         // dataSeletText: '请选择状态',
         // 时间选择
         createTime: '',
         endTime: '',
         // createTime: '',
         // endTime: '',
         // 复选框
         checkBoxValue:[],
         totalSelectValue:[],
         checkBoxValue: [],
         totalSelectValue: [],
         // 选择器
         statusSeletShow: false,
         statusList: [['中国', '美国', '日本']],
         deleteApplicationModalShow:false,
         yibanData: []
         // statusSeletShow: false,
         // statusList: [['中国', '美国', '日本']],
         yibanData: [],
         // 删除申请
         deleteIds: '',
         deleteApplicationModalShow: false,
         haveTodoParams: {
            name: '',
            pageNumber: 1,
            pageSize: 10,
            sort: 'createTime',
            order: 'desc',
            title: '',
            startDate: '',
            endDate: ''
         },
         // 上拉加载更多
         timer: {},
         load: 0,
         loadingText: '加载中...',
         loadingType: 0,
         contentText: {
            contentDown: '上拉显示更多',
            contentRefresh: '正在加载...',
            contentNomore: '没有更多数据了'
         }
      };
   },
   onShow(){
      if(this.menuShow == true){
         this.$refs.menuRef.menuClick()
   // 上拉加载更多
   onReachBottom() {
      if (this.timer != null) {
         clearTimeout(this.timer);
      }
      this.timer = setTimeout(() => {
         this.getMoreNews();
      }, 1000);
   },
   // 返回顶部
   onPageScroll(e) {
      this.scrollTop = e.scrollTop;
   },
   // 下拉加载
   onPullDownRefresh() {
      console.log('refresh');
      setTimeout(() => {
         uni.stopPullDownRefresh();
      }, 1000);
      this.init();
   },
   onShow() {
      if (this.menuShow == true) {
         this.$refs.menuRef.menuClick();
      }
      this.init();
   },
   // 点击导航栏菜单后
   onNavigationBarButtonTap(e) {
      // console.log(e);
      this.$refs.menuRef.menuClick()
      this.$refs.menuRef.menuClick();
   },
   components: {
      combinationCard,
      popupMenu
   },
   methods: {
      init(){
         this.doneList();
      init() {
         this.haveTodoParams.pageNumber = 1;
         this.loadingType = 0;
         this.yibanData = [];
         // this.doneList();
         this.getMoreNews();
      },
      // 已办
      doneList() {
         this.$reqGet('doneList', this.haveTodoParams).then(res => {
            if (res.code === 0) {
               // console.log('已办', res);
               this.yibanData = res.data.content;
      getMoreNews() {
         if (this.loadingType !== 0) {
            //loadingType!=0;直接返回
            return false;
         }
         uni.showLoading({
            title: '加载中...'
         });
         this.loadingType = 1;
         uni.showNavigationBarLoading(); //显示加载动画
         this.$reqGet('doneList', this.haveTodoParams).then(response => {
            uni.hideLoading();
            this.haveTodoParams.pageNumber++; // 得到数据之后 page+1
            if (response.data.content.length < 1) {
               // 没有数据
               this.loadingType = 2;
               uni.hideNavigationBarLoading(); // 关闭加载动画
               uni.showToast({
                  title: '没有更多数据了！',
                  icon: 'error'
               });
               return;
            }
            // this.myApplication.pageNumber++; // 每触底一次 page +1
            if (this.haveTodoParams.name || this.haveTodoParams.title || this.haveTodoParams.startDate || this.haveTodoParams.endTime) {
               if (this.haveTodoParams.pageNumber == 1) {
                  this.yibanData = response.data.content;
               } else {
                  this.yibanData = this.yibanData.concat(response.data.content);
               }
            } else {
               if (this.haveTodoParams.pageNumber == 1) {
                  this.yibanData = [];
               }
               this.yibanData = this.yibanData.concat(response.data.content);
            }
            //将数据拼接在一起
            this.loadingType = 0; // 将loadingType归0重置
            uni.hideNavigationBarLoading(); // 关闭加载动画
         });
      },
      menushow(e){
         this.menuShow = e
      // 已办
      // doneList() {
      //    uni.showLoading({
      //       title:'加载中...'
      //    })
      //    this.$reqGet('doneList', this.haveTodoParams).then(res => {
      //       uni.hideLoading();
      //       if (res.code === 0) {
      //          // console.log('已办', res);
      //          this.yibanData = res.data.content;
      //       }
      //    });
      // },
      searchChange(e) {
         console.log('e', e);
      },
      deleteApplicationClick(id){
         if(this.checkBoxValue.length > 0){
      searchClose(e) {
         console.log('e', e);
      },
      searchOpen(e) {
         console.log('e', e);
      },
      // 搜索
      searchButtonClick() {
         this.loadingType == 0;
         this.haveTodoParams.pageNumber = 1;
         this.init();
      },
      // 清空
      emptyButtonClick() {
         this.loadingType == 0;
         this.haveTodoParams.pageNumber = 1;
         this.haveTodoParams.name = '';
         this.haveTodoParams.title = '';
         this.haveTodoParams.startDate = '';
         this.haveTodoParams.endDate = '';
         this.init();
      },
      menushow(e) {
         this.menuShow = e;
      },
      deleteApplicationClick(id) {
         this.deleteIds = id;
         this.deleteApplicationModalShow = true;
      },
      deleteApplicationClickAll() {
         if (this.checkBoxValue.length > 0) {
            this.deleteIds = this.checkBoxValue.toString(',');
            this.deleteApplicationModalShow = true;
         } else {
            this.$u.toast('未选中申请');
         }
      },
      // 删除申请模态框
      deleteApplicationModalConfirm() {
         this.deleteApplicationModalShow = false;
         this.$reqPost('deleteHistoric', { ids: this.deleteIds }, 'form').then(res => {
            if (res.code == 0) {
               this.$nextTick(() => {
                  this.$u.toast('操作成功！');
               });
               this.yibanData = [];
               this.init();
            } else {
               this.$u.toast('操作失败！！！');
            }
         });
      },
      deleteApplicationModalCancel() {
         this.deleteApplicationModalShow = false;
      },
      // 时间选择器
      startDateChange() {
         this.queryRealTimeShippingData.startDate = '';
         this.$nextTick(() => {
            console.log(this.queryRealTimeShippingData);
            this.realTimeShipping();
         });
         // this.queryRealTimeShippingData.startDate = '';
         // this.$nextTick(() => {
         //    console.log(this.queryRealTimeShippingData);
         //    this.realTimeShipping();
         // });
      },
      endDateChange() {
         this.queryRealTimeShippingData.endDate = '';
         this.$nextTick(() => {
            console.log(this.queryRealTimeShippingData);
            this.realTimeShipping();
         });
      },
      // 搜索
      searchIconClick() {
         console.log(1111, this.searchData);
         // this.queryRealTimeShippingData.endDate = '';
         // this.$nextTick(() => {
         //    console.log(this.queryRealTimeShippingData);
         //    this.realTimeShipping();
         // });
      },
      // 复选框
      checkboxChange(n){
      checkboxChange(n) {
         console.log(n);
      },
      totalSelectChange(n){
         if(n[0] == 'tatalSelect'){
            this.yibanData.forEach(item=>{
               this.totalSelectValue.push(item.id)
            })
            this.checkBoxValue = this.totalSelectValue
         }else{
            this.checkBoxValue = []
      totalSelectChange(n) {
         if (n[0] == 'tatalSelect') {
            this.yibanData.forEach(item => {
               this.totalSelectValue.push(item.id);
            });
            this.checkBoxValue = this.totalSelectValue;
         } else {
            this.checkBoxValue = [];
         }
      },
      // 状态
      statusConfirm(a){
         this.statusSeletShow = false
         console.log(a)
      },
      // statusConfirm(a){
      //    this.statusSeletShow = false
      //    console.log(a)
      // },
      // 表单数据
      theFormDataClick() {
      theFormDataClick(v) {
         uni.navigateTo({
            url: '/pages/the-form-data/the-form-data'
            url: `/pages/the-form-data/the-form-data?index=${v}`
         });
      },
      // 审批历史
      approvalHistoryClick() {
      approvalHistoryClick(v) {
         uni.navigateTo({
            url: '/pages/approval-history/approval-history'
            url: `/pages/approval-history/approval-history?index=${v}`
         });
      }
   }
@@ -240,85 +388,140 @@
<style lang="scss" scoped>
::v-deep.my-have-todo {
   // 搜索区域
   .searchBox {
      width: 91%;
      display: flex;
      justify-content: space-between;
   .searchContainer {
      width: 94%;
      margin: vww(16) auto;
      .search {
         width: vww(160);
         border: 1px solid #d1d1d1;
         border-radius: vww(4);
         .u-search {
            .u-search__content {
               height: 40px;
               background-color: #ffffff !important;
               .u-search__content__icon {
                  width: 10px;
                  height: 5.5px;
               }
               .u-search__content__input {
                  background-color: #ffffff !important;
                  .uni-input-placeholder{
                     color:#CCCCCC!important;
      .u-collapse {
         .u-collapse-item {
            .u-collapse-item__content {
               .searchButton {
                  width: 100%;
                  margin: 0 auto;
                  display: flex;

                  .u-button {
                     width: 30%;
                  }
               }
            }
         }
      }
      // 下拉菜单
      .data-selet {
         border: 1px solid #d1d1d1;
         border-radius: 4px;
         width: vww(160);
         // width: 100%;
         height: 40px;
         display: flex;
         align-items: center;
         font-size: 13px;
         color: #CCCCCC;
         .uni-select__icon {
            display: flex;
            align-content: center;
            margin: 0 10px;
            image {
               width: 10px;
               height: 5.5px;
            }
         }
         .content {
            margin-left: vww(8);
            width: vww(150);
         }
      }
   }

   // 时间搜索
   .timeContiner {
      width: 91%;
      margin: 0 auto vww(16);
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      .uni-date {
         width: vww(160);
         .uni-date-editor {
            .uni-date-editor--x  {
               .uni-date-x {
                  .uni-date__x-input {
                     .uni-input-wrapper{
                        .uni-input-placeholder{
                           color:#CCCCCC;
                           font-size: vww(13);
               .searchBox {
                  width: 100%;
                  display: flex;
                  justify-content: space-between;
                  margin: 0 auto vww(16);

                  .search {
                     width: vww(158);
                     border: 1px solid #d1d1d1;
                     border-radius: vww(4);

                     .u-search {
                        .u-search__content {
                           height: 40px;
                           background-color: #ffffff !important;

                           .u-search__content__icon {
                              width: 10px;
                              height: 5.5px;
                           }

                           .u-search__content__close {
                              width: 16px !important;
                              height: 16px !important;
                              background-color: #cccccc !important;

                              .u-icon {
                                 .u-icon__icon {
                                    font-size: 10px !important;
                                 }
                              }
                           }

                           .u-search__content__input {
                              background-color: #ffffff !important;

                              .uni-input-placeholder {
                                 color: #cccccc !important;
                              }
                           }
                        }
                     }
                  }

                  // 下拉菜单
                  .data-selet {
                     border: 1px solid #d1d1d1;
                     border-radius: 4px;
                     width: vww(158);
                     // width: 100%;
                     height: 40px;
                     display: flex;
                     align-items: center;
                     font-size: 13px;
                     color: #cccccc;

                     .uni-select__icon {
                        display: flex;
                        align-content: center;
                        margin: 0 10px;

                        image {
                           width: 10px;
                           height: 5.5px;
                        }
                     }

                     .content {
                        margin-left: vww(8);
                        width: vww(158);
                     }
                  }
               }

               // 时间搜索
               .timeContiner {
                  width: 100%;
                  margin: 0 auto vww(16);
                  display: flex;
                  flex-direction: row;
                  justify-content: space-between;

                  .uni-date {
                     width: vww(160);

                     .uni-date-editor {
                        .uni-date-editor--x {
                           .uni-date-x {
                              .uni-date__x-input {
                                 .uni-input-wrapper {
                                    .uni-input-placeholder {
                                       color: #cccccc;
                                       font-size: vww(13);
                                    }
                                 }
                              }
                           }
                        }

                        .uni-date-x--border {
                           border: 1px solid #d1d1d1 !important;
                        }
                     }
                  }
               }
            }
            .uni-date-x--border{
               border: 1px solid #d1d1d1!important;
            }
         }
      }
   }
   // 卡片头部
   .cardCheckGroup {
      margin-bottom: vww(48);
      .u-checkbox-group {
      }
   }
   .yibanTop {
      .u-checkbox {
         display: inline-block;
      }
   }

@@ -326,12 +529,15 @@
   .center-container {
      display: flex;
      flex-direction: column;

      .center-content__one {
         display: flex;

         view {
            width: 50%;
         }
      }

      .center-content__two {
         display: flex;
         // margin: vww(10) 0;
@@ -339,15 +545,19 @@
            width: 50%;
         }
      }

      .center-content__three {
         display: flex;

         view {
            width: 50%;
         }
      }

      .center-content__four {
      }
   }

   // 中间部分样式
   .center-margin {
      margin-bottom: vww(16);
@@ -358,17 +568,21 @@
      .bottom-content__item {
         display: flex;
         justify-content: space-around;

         view {
            display: flex;
            justify-content: center;
            align-content: center;
            margin-right: vww(10);
            &:nth-last-child() {

            &:nth-last-child(1) {
               margin-right: 0;
            }

            view {
               display: inline-block;
            }

            image {
               width: vww(16);
               height: vww(16);
@@ -377,31 +591,44 @@
         }
      }
   }
	

   // 返回顶部
   .back-top-container {
      .u-transition {
         position: fixed;
         bottom: vww(80) !important;
         right: vww(20) !important;
      }
   }

   // 底部
   .bottomTabbar{
      position:fixed;
      bottom:0;
      width:100%;
      height:vww(48);
      display:flex;
   .bottomTabbar {
      position: fixed;
      bottom: 0;
      width: 100%;
      height: vww(48);
      display: flex;
      align-items: center;
      justify-content: space-between;
      background-color:#F5F5F5;
      .bottomTabbar_checkBox{
         margin-left:vww(16);
         .u-checkbox-group{
            .u-checkbox{
      background-color: #f5f5f5;

      .bottomTabbar_checkBox {
         margin-left: vww(16);

         .u-checkbox-group {
            .u-checkbox {
            }
         }
      }
      .bottomTabbar_button{
         display:flex;
         .u-button{
            font-size:13px;
            margin-right:vww(14);
            width:vww(90);
            height:vww(32);

      .bottomTabbar_button {
         display: flex;

         .u-button {
            font-size: 13px;
            margin-right: vww(14);
            width: vww(90);
            height: vww(32);
         }
      }
   }