付延余
2022-07-28 548b97b82e741b67c4258661352ae28462a34f66
pages/my-todo/my-todo.vue
@@ -2,10 +2,21 @@
   <!-- 我的待办 -->
   <view class="my-todo">
      <!-- 搜索区域 -->
      <view class="searchContainer">
      <u-collapse :border="true"
                  @change="searchChange"
                  @close="searchChange"
                  @open="searchOpen"
      >
        <u-collapse-item :border="false"
                         title="搜索框"
                         name="Docs guide"
        >
         <view class="searchBox">
            <view class="search">
               <u-search @clickIcon="searchIconClick" :clearabled="true" :showAction="false" placeholder="请输入标题" v-model="todoParams.title" shape="square"></u-search>
              <u-search @clickIcon="searchIconClick" :clearabled="true" :showAction="false" placeholder="请输入标题"
                        v-model="todoParams.title" shape="square"></u-search>
            </view>
            <!-- 状态选择器 -->
            <!-- <view class="data-selet" @click="statusSeletShow = true">
@@ -15,21 +26,27 @@
               <view class="uni-select__icon"><image src="@/static/icon/select.png" mode="加载失败"></image></view>
            </view> -->
            <view class="search">
               <u-search @clickIcon="searchIconClick" :clearabled="true" :showAction="false" placeholder="请输入任务名称" v-model="todoParams.name" shape="square"></u-search>
              <u-search @clickIcon="searchIconClick" :clearabled="true" :showAction="false" placeholder="请输入任务名称"
                        v-model="todoParams.name" shape="square"></u-search>
            </view>
         </view>
         
         <!-- 时间搜索区域 -->
         <view class="timeContiner">
            <uni-datetime-picker class="time-picker" type="date" :clear-icon="true" v-model="todoParams.startDate" @change="startDateChange" placeholder="开始时间" />
            <uni-datetime-picker class="time-picker" type="date" :clear-icon="true" v-model="todoParams.endDate" @change="endDateChange" placeholder="结束时间" />
            <uni-datetime-picker class="time-picker" type="date" :clear-icon="true" v-model="todoParams.startDate"
                                 @change="startDateChange" placeholder="开始时间"/>
            <uni-datetime-picker class="time-picker" type="date" :clear-icon="true" v-model="todoParams.endDate"
                                 @change="endDateChange" placeholder="结束时间"/>
         </view>
         
         <view class="searchButton">
            <u-button type="primary" text="搜索" @click="searchButtonClick"></u-button>
            <u-button type="primary" text="清空" :plain="true" @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">
@@ -63,10 +80,10 @@
               <view class="bottom-container">
                  <!-- 待办按钮 -->
                  <view class="bottom-content__item">
                     <!-- <view @click="theFormDataClick">
              <view @click="theFormDataClick(item.tableId)" v-if="item.procDefId == 'WAY_BILL:4:87504'">
                        <image src="@/static/home/jindu.png" mode=""></image>
                        <view>申请详情</view>
                     </view> -->
              </view>
                     <view @click="adopClick(item)">
                        <image src="@/static/home/tongguo.png" mode=""></image>
                        <view>通过</view>
@@ -100,17 +117,22 @@
      <!-- 通过模态框 -->
      <view class="adoptModal">
         <u-modal width="684rpx" :show="adoptModalShow" title="审批通过" :showCancelButton="true" @confirm="adoptModalConfirm" @cancel="adoptModalCancel">
            <view class="slot-content"><view class="rejectMesaage">
      <u-modal width="684rpx" :show="adoptModalShow" title="审批通过" :showCancelButton="true" @confirm="adoptModalConfirm"
               @cancel="adoptModalCancel">
        <view class="slot-content">
          <view class="rejectMesaage">
                  <u-icon name="info-circle-fill" color="#0307ff"></u-icon>
                  <text>{{ modalType == 0 ? '注意:将默认分配给节点设定的所有可审批用户' : '注意:所有流程将驳回至发起人' }}</text>
               </view><u--textarea v-model="adoptForm.comment" placeholder="请输入审批意见"></u--textarea></view>
          </view>
          <u--textarea v-model="adoptForm.comment" placeholder="请输入审批意见"></u--textarea>
        </view>
         </u-modal>
      </view>
      <!-- 驳回模态框 -->
      <view class="rejectModal">
         <u-modal width="684rpx" :show="rejectModalShow" title="驳回" :showCancelButton="true" @confirm="rejectModalConfirm" @cancel="rejectModalCancel">
      <u-modal width="684rpx" :show="rejectModalShow" title="驳回" :showCancelButton="true" @confirm="rejectModalConfirm"
               @cancel="rejectModalCancel">
            <view class="slot-content">
               <view class="rejectMesaage">
                  <u-icon name="info-circle-fill" color="#0307ff"></u-icon>
@@ -155,6 +177,9 @@
         </u-modal>
      </view> -->
      
    <!--返回顶部-->
    <u-back-top :scroll-top="scrollTop"></u-back-top>
      <!-- 菜单栏 -->
      <popup-menu @menuShow="menushow" ref="menuRef"></popup-menu>
   </view>
@@ -163,9 +188,11 @@
<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,
         // 复选框
         checkBoxValue:[],
         totalSelectValue:[],
@@ -212,11 +239,15 @@
         }
      };
   },
  // 返回顶部
  onPageScroll(e) {
    this.scrollTop = e.scrollTop;
  },
   onShow(){
      if(this.menuShow == true){
         this.$refs.menuRef.menuClick()
      }
      this.myApplication.pageNumber = 1;
    this.todoParams.pageNumber = 1;
      this.init();
   },
   // 点击导航栏菜单后
@@ -240,9 +271,6 @@
   // 下拉加载
   onPullDownRefresh() {
      console.log('refresh');
      this.todoParams.pageNumber = 1;
      this.loadingType = 0;
      this.daibanData = [];
      setTimeout(()=> {
         uni.stopPullDownRefresh();
      }, 1000);
@@ -250,6 +278,9 @@
   },
   methods: {
      init(){
      this.todoParams.pageNumber = 1;
      this.loadingType = 0;
      this.daibanData = [];
         // this.todoList();
         this.getMoreNews();
      },
@@ -262,13 +293,17 @@
      //    });
      // },
      getMoreNews() {
         if (this.loadingType !== 0) {
      if (this.loadingType != 0) {
            //loadingType!=0;直接返回
            return false;
         }
      uni.showLoading({
        title: "加载中..."
      })
         this.loadingType = 1;
         uni.showNavigationBarLoading(); //显示加载动画
         this.$reqGet('todoList', this.todoParams).then(res => {
        uni.hideLoading();
               // if (res.code === 0) {
               //    this.daibanData = res.data.content;
               // }
@@ -284,9 +319,16 @@
                  return;
               }
               
               if(this.todoParams.name||this.todoParams.startTime||this.todoParams.endTime||this.todoParams.title){
                  this.daibanData = res.data.content
        if (this.todoParams.name != '' || this.todoParams.startDate != '' || this.todoParams.endDate != '' || this.todoParams.title != '') {
          if(this.todoParams.pageNumber == 1){
            this.daibanData = res.data.content;
               } else{
            this.daibanData = this.daibanData.concat(res.data.content);
          }
        } else {
          if(this.todoParams.pageNumber == 1){
            this.daibanData = [];
          }
                  this.daibanData = this.daibanData.concat(res.data.content);
               }
                //将数据拼接在一起
@@ -296,11 +338,14 @@
      },
      // 搜索点击
      searchButtonClick(){
      this.loadingType == 0;
         this.todoParams.pageNumber = 1;
         this.init();
      },
      // 清空
      emptyButtonClick(){
      this.loadingType == 0;
      this.todoParams.pageNumber = 1;
         this.todoParams.name = '';
         this.todoParams.title = '';
         this.todoParams.startDate = '';
@@ -324,6 +369,15 @@
         //    console.log(this.queryRealTimeShippingData);
         //    this.realTimeShipping();
         // });
    },
    searchChange(e){
      console.log('e', e);
    },
    searchClose(e){
      console.log('e', e);
    },
    searchOpen(e){
      console.log('e', e);
      },
      // 搜索
      searchIconClick() {
@@ -351,9 +405,9 @@
         console.log('totalSelect',n);
      },
      // 表单数据
      theFormDataClick() {
    theFormDataClick(v) {
         uni.navigateTo({
            url: '/pages/the-form-data/the-form-data'
        url: `/pages/the-form-data/the-form-data?index=${v}`
         });
      },
      // 审批历史
@@ -437,34 +491,58 @@
::v-deep.my-todo {
   // 搜索区域
   .searchContainer{
      .searchButton{
         width:91%;
         margin: vww(16) auto;
    .u-collapse {
      .u-collapse-item {
        .u-collapse-item__content {
          .searchButton {
            width: 100%;
            margin: 0 auto;
         display:flex;
         .u-button{
            width:30%;
         }
      }
      // 条件搜索
      .searchBox {
         width: 91%;
            width: 100%;
         display: flex;
         justify-content: space-between;
         margin: vww(16) auto;
            margin: 0 auto vww(16);
         .search {
            width: vww(160);
              width: vww(150);
            border: 1px solid #d1d1d1;
            border-radius: vww(4);
            .u-search {
               .u-search__content {
                  height: 38px;
                  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;
                     }
@@ -472,41 +550,48 @@
               }
            }
         }
         // 下拉菜单
         .data-selet {
            border: 1px solid #d1d1d1;
            border-radius: 4px;
            width: vww(160);
              width: vww(150);
            // 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%;
            width: 100%;
         margin: 0 auto vww(16);
         display: flex;
         flex-direction: row;
         justify-content: space-between;
         .uni-date {
            width: vww(160);
              width: vww(150);
            .uni-date-editor {
               .uni-date-editor--x  {
                  .uni-date-x {
@@ -520,29 +605,34 @@
                     }
                  }
               }
               .uni-date-x--border{
                  border: 1px solid #d1d1d1!important;
               }
            }
         }
      }
        }
      }
   }
   
  }
   
   // 卡片中间
   .center-container {
      display: flex;
      flex-direction: column;
      .center-content__one {
         display: flex;
         view {
            width: 50%;
         }
      }
      .center-content__two {
         display: flex;
         // margin: vww(10) 0;
@@ -550,15 +640,19 @@
            width: 50%;
         }
      }
      .center-content__three {
         display: flex;
         view {
            width: 50%;
         }
      }
      .center-content__four {
      }
   }
   // 中间部分样式
   .center-margin {
      margin-bottom: vww(16);
@@ -569,17 +663,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);
@@ -599,15 +697,19 @@
      align-items: center;
      justify-content: space-between;
      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);
@@ -628,14 +730,17 @@
            border: 1px solid #0307ff;
            border-radius: vww(4);
            font-size: 13px;
            text {
               margin-left: vww(5);
            }
         }
         .u-textarea {
            margin-top:vww(10);
            width: vww(280);
            height: vww(90) !important;
            .uni-textarea-wrapper {
               height: vww(90) !important;
            }
@@ -647,20 +752,24 @@
   .rejectModal {
      .slot-content {
         display: inline-block;
         .rejectMesaage {
            display: flex;
            padding: vww(3);
            border: 1px solid #0307ff;
            border-radius: vww(4);
            font-size: 13px;
            text {
               margin-left: vww(5);
            }
         }
         .u-textarea {
            margin-top:vww(10);
            width: vww(280);
            height: vww(90) !important;
            .uni-textarea-wrapper {
               height: vww(90) !important;
            }
@@ -668,9 +777,11 @@
         
         .rejectBack {
            margin-top:vww(24);
            .rejectBack-title {
               font-size: vww(13);
            }
            // 下拉菜单
            .data-selet {
               border: 1px solid #d1d1d1;
@@ -682,15 +793,18 @@
               font-size: 13px;
               color: #666;
               margin-top:vww(8);
               .uni-select__icon {
                  display: flex;
                  align-content: center;
                  margin: 0 10px;
                  image {
                     width: 10px;
                     height: 5.5px;
                  }
               }
               .content {
                  margin-left: vww(8);
                  width: vww(280);