pages/home/home.vue
@@ -1,807 +1,1113 @@
<template>
   <view class="home">
      <!-- 轮播图 -->
      <view class="home_swipe"><u-swiper :list="list3" indicator indicatorMode="line" circular></u-swiper></view>
      <!-- 我的申请 -->
      <combined-title title="我的申请" detailsPath="/pages/my-application/my-application" v-if="$store.state.shenqingMenu"></combined-title>
      <combination-card v-for="(item, index) in shenqingData" index="index" v-if="$store.state.shenqingMenu">
         <template v-slot:top>
            <view>
               <text>{{ item.title }}</text>
            </view>
         </template>
         <template v-slot:center>
            <view class="center-container">
               <view class="center-content__one center-margin">
                  <view class="">
                     <text>所属流程:{{ item.processName }}</text>
                  </view>
                  <view class="">
                     <text>审批环节:{{ item.currTaskName }}</text>
                  </view>
               </view>
               <view class="center-content__two center-margin">
                  <view class="">
                     状态:
                     <text :style="{ color: statusColor[item.status] }">{{ status[item.status] }}</text>
                  </view>
                  <view class="">
                     结果:
                     <text :style="{ color: resultColor[item.result] }">{{ result[item.result] }}</text>
                  </view>
               </view>
               <view class="center-content__three center-margin">
                  <text>创建时间:{{ item.createTime }}</text>
               </view>
               <view class="center-content__four">
                  <text>提交申请时间:{{ item.applyTime }}</text>
               </view>
            </view>
         </template>
         <template v-slot:bottom>
            <view class="bottom-container">
               <!-- 按钮区域 -->
               <view class="bottom-content__chulizhong bottom-content__item">
                  <view @click="withDrawClick(item.id)" v-if="item.status == 1">
                     <image src="@/static/home/cehui.png" mode=""></image>
                     <view>撤回</view>
                  </view>
                  <view @click="checkTheScheduleClick(item.procInstId)" v-if="item.status == 1">
                     <image src="@/static/home/jindu.png" mode=""></image>
                     <view>查看进度</view>
                  </view>
                  <view @click="theFormDataClick(item.tableId)" v-if="item.status == 1 || item.status == 2">
                     <image src="@/static/home/biaodan.png" mode=""></image>
                     <view>申请详情</view>
                  </view>
                  <view @click="apply(item)" v-if="item.status == 3">
                     <image src="@/static/home/history.png" mode=""></image>
                     <view>重新申请</view>
                  </view>
                  <view @click="editMyApplication(item)" v-if="item.status == 3">
                     <image src="@/static/home/history.png" mode=""></image>
                     <view>编辑</view>
                  </view>
                  <view @click="approvalHistoryClick(item.procInstId)" v-if="item.status == 2 || item.status == 3">
                     <image src="@/static/home/history.png" mode=""></image>
                     <view>审批历史</view>
                  </view>
               </view>
               <!-- 已结束小组按钮 -->
               <!-- <view class="bottom-content__chulizhong bottom-content__item" v-if="item.status == 2">
                  <view @click="theFormDataClick">
                     <image src="@/static/home/biaodan.png" mode=""></image>
                     <view>表单数据</view>
                  </view>
               </view> -->
            </view>
         </template>
      </combination-card>
      <!-- 我的待办 -->
      <combined-title title="我的待办" detailsPath="/pages/my-todo/my-todo"></combined-title>
      <combination-card v-for="(item, index) in daibanData" index="index">
         <template v-slot:top>
            <view>
               <text>{{ item.actBusiness.title }}</text>
            </view>
         </template>
         <template v-slot:center>
            <view class="center-container">
               <view class="center-content__one center-margin">
                  <view class="">
                     <text>任务名称:{{ item.name }}</text>
                  </view>
                  <view class="">
                     <text>所属流程:{{ item.processName }}</text>
                  </view>
               </view>
               <view class="center-content__two center-margin">
                  <text>发起人:{{ item.actBusiness.createByName }}</text>
               </view>
               <view class="center-content__three">
                  <text>创建时间:{{ item.createTime }}</text>
               </view>
            </view>
         </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/jindu.png" mode=""></image>
                     <view>申请详情</view>
                  </view>
                  <view @click="adopClick(item)">
                     <image src="@/static/home/tongguo.png" mode=""></image>
                     <view>通过</view>
                  </view>
                  <view @click="rejectClick(item)">
                     <image src="@/static/home/bohui.png" mode=""></image>
                     <view>驳回</view>
                  </view>
                  <view @click="approvalHistoryClick(item.procInstId)">
                     <image src="@/static/home/history.png" mode=""></image>
                     <view>历史</view>
                  </view>
               </view>
            </view>
         </template>
      </combination-card>
      <!-- 我的已办 -->
      <combined-title title="我的已办 " detailsPath="/pages/my-have-todo/my-have-todo"></combined-title>
      <combination-card v-for="(item, index) in yibanData" index="index">
         <template v-slot:top>
            <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>
                  <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 }}</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(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>
         </template>
      </combination-card>
      <!-- 撤回模态框 -->
      <view class="wodeshenqingMotai">
         <u-modal width="684rpx" :show="withDrawShow" title="撤回原因" :showCancelButton="true" @confirm="withDrawConfirm" @cancel="withDrawCancel">
            <view class="slot-content"><u--textarea v-model="withDrawData.reason" placeholder="请输入撤回原因"></u--textarea></view>
         </u-modal>
      </view>
      <!-- 通过模态框 -->
      <view class="adoptModal">
         <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>
         </u-modal>
      </view>
      <!-- 驳回模态框 -->
      <view class="rejectModal">
         <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>
                  <text>{{ modalType == 0 ? '注意:将默认分配给节点设定的所有可审批用户' : '注意:所有流程将驳回至发起人' }}</text>
               </view>
               <u--textarea v-model="rejectForm.comment" placeholder="请输入审批意见"></u--textarea>
               <!-- <view class="rejectBack">
                  <view class="rejectBack-title"><text>驳回至</text></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>
         </u-modal>
      </view>
      <!-- 删除已办申请模态框 -->
      <view class="deleteApplicationModal">
         <u-modal
            :show="deleteApplicationModalShow"
            title="提示"
            content="确定删除该申请?"
            :showCancelButton="true"
            @confirm="deleteApplicationModalConfirm"
            @cancel="deleteApplicationModalCancel"
         ></u-modal>
      </view>
      <!-- 选择器 -->
      <!-- <u-picker @cancel="statusSeletShow = false" @confirm="statusConfirm" :show="statusSeletShow" :columns="statusList"></u-picker> -->
      <!-- 菜单栏 -->
      <popup-menu @menuShow="menushow" ref="menuRef"></popup-menu>
   </view>
</template>
<script>
import { timeConsuming } from '@/utils/nowDate.js';
import popupMenu from '@/components/common/popup-menu/popup-menu.vue';
import combinedTitle from '@/components/common/combined-title/combined-title.vue';
import combinationCard from '@/components/common/combination-card/combination-card.vue';
import { setAccessToken } from '@/utils/status.js';
export default {
   name: 'home',
   data() {
      return {
         // menuShow:false,// 菜单显示
         status: ['草稿', '处理中', '已结束', '已撤回'],
         statusColor: ['#dd8b8c', '#FF9900', '#007AFF', '#06BE00'],
         result: ['未提交', '处理中', '通过', '驳回'],
         resultColor: ['#dd8b8c', '#FF9900', '#06BE00', '#be2b2d'],
         list3: ['https://cdn.uviewui.com/uview/swiper/swiper3.png', 'https://cdn.uviewui.com/uview/swiper/swiper2.png', 'https://cdn.uviewui.com/uview/swiper/swiper1.png'],
         // 撤回模态框
         withDrawShow: false,
         withDrawData: {
            reason: '',
            id: '', // 撤回申请ID
            procInstId: ''
         },
         withDrawContent: '',
         // 重新申请
         form: {
            sendMessage: true,
            sendSms: true,
            sendEmail: true,
            procDefId: '',
            assignees: [],
            priority: '0'
         },
         assigneeList: [],
         showAssign: false,
         isGateway: false,
         isCustom: false,
         // 通过模态框
         adoptModalShow: false,
         // 通过请求
         adoptForm: {
            ids: '',
            comment: ''
         },
         // 驳回模态框
         rejectModalShow: false,
         rejectModalContent: '',
         // dataSeletText: '请选择状态',
         // 驳回请求
         rejectForm: {
            procInstIds: '',
            comment: ''
         },
         modalType: 0,
         // 删除申请模态框
         deleteApplicationModalShow: false,
         procInstId:'',
         // 选择器
         statusSeletShow: false,
         statusList: [['中国', '美国', '日本']],
         // data
         shenqingData: [],
         daibanData: [],
         yibanData: [],
         menuShow: false,
         // 申请
         myApplicationParams: {
            status: '',
            result: '',
            pageNumber: 1,
            pageSize: 2,
            sort: 'createTime',
            order: 'desc'
         },
         // 待办
         todoParams: {
            pageNumber: 1,
            pageSize: 2
         },
         haveTodoParams: {
            pageNumber: 1,
            pageSize: 2,
            sort: 'createTime',
            order: 'desc'
         }
      };
   },
   // 点击导航栏菜单后
   onNavigationBarButtonTap(e) {
      console.log(e);
      this.$refs.menuRef.menuClick();
   },
   onLoad(){
      console.log('加载页面');
      wx.hideShareMenu({
        menus: ['shareAppMessage', 'shareTimeline']
      })
   },
   onShow() {
      if (this.menuShow == true) {
         this.$refs.menuRef.menuClick();
      }
      this.init();
   },
   components: {
      combinedTitle,
      combinationCard,
      popupMenu
   },
   methods: {
      getUserInfo() {
         this.$reqGet('getUserInfo').then(res => {
            if (res.code == 0) {
               uni.setStorageSync('userInfo', res.data.sysUser);
            }
         });
      },
      init() {
         this.getUserInfo();
         this.getProcessDataList(); // 申请列表
         this.todoList(); // 我的待办
         this.doneList(); // 我的已办
      },
      getProcessDataList() {
         this.$reqGet('getProcessDataList', this.myApplicationParams).then(res => {
            if (res.code === 0) {
               // console.log('申请', res);
               this.shenqingData = res.data.records;
            }
         });
      },
      todoList() {
         this.$reqGet('todoList', this.todoParams).then(res => {
            if (res.code === 0) {
               // console.log('待办', res);
               this.daibanData = res.data.content;
            }
         });
      },
      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;
            }
         });
      },
      menushow(e) {
         this.menuShow = e;
      },
      // 撤回模态框
      withDrawClick(id) {
         this.withDrawShow = true;
         this.withDrawData.id = id;
      },
      withDrawConfirm() {
         this.shenqingData.forEach(i => {
            if (i.id == this.withDrawData.id) {
               this.withDrawData.procInstId = i.procInstId;
            }
         });
         if (this.withDrawData.reason.length >= 2) {
            this.$reqPost('withDraw', this.withDrawData, 'form').then(res => {
               this.withDrawShow = false;
               if (res.code == 0) {
                  uni.showToast({
                     title: res.data,
                     duration: 2000
                  });
               }
               this.getProcessDataList();
            });
         } else {
            uni.showToast({
               title: '请规范输入',
               duration: 2000
            });
         }
      },
      // 通过
      adopClick(v) {
         console.log('通过点击', v);
         this.adoptModalShow = true;
         this.adoptForm.ids = v.id;
         this.modalType = 0;
         // let urlparam = v.procDefId+'/'+v.key;
         // this.$reqGet('getNextNode',{},urlparam).then(res=>{
         //    console.log('通过欲请求');
         // })
      },
      // 通过模态框
      adoptModalConfirm() {
         this.adoptModalShow = false;
         this.adoptForm.comment = this.adoptModalContent;
         this.$reqPost('passAll', this.adoptForm, 'form').then(res => {
            if (res.code == 0) {
               this.$u.toast('操作成功!');
            } else {
               this.$u.toast('添加失败!!');
            }
         });
      },
      adoptModalCancel() {
         this.adoptModalShow = false;
      },
      // 驳回
      rejectClick(v) {
         this.modalType = 1;
         this.rejectModalShow = true;
         this.rejectForm.procInstIds = v.procInstId;
      },
      // 驳回模态框
      rejectModalConfirm() {
         this.rejectModalShow = false;
         this.$reqPost('backAll', this.rejectForm, 'form').then(res => {
            if (res.code == 0) {
               this.$u.toast('操作成功!');
            } else {
               this.$u.toast('操作失败!!!');
            }
            this.todoList(); // 我的待办
         });
      },
      rejectModalCancel() {
         this.rejectModalShow = false;
      },
      withDrawCancel() {
         this.withDrawShow = false;
      },
      // 删除申请模态框
      deleteApplicationModalConfirm() {
         this.deleteApplicationModalShow = false;
         this.$reqPost('deleteHistoric',{ids:this.procInstId},'form').then(res=>{
            if(res.code == 0){
               this.$u.toast('操作成功!')
               this.yibanData = [];
               this.doneList(); // 我的已办
            } else {
               this.$u.toast('操作失败!!!')
            }
         })
      },
      deleteApplicationModalCancel() {
         this.deleteApplicationModalShow = false;
      },
      // 查看进度
      checkTheScheduleClick(v) {
         uni.navigateTo({
            url: `/pages/check-the-schedule/check-the-schedule?index=${v}`
         });
      },
      // 表单数据
      theFormDataClick(v) {
         uni.navigateTo({
            url: `/pages/the-form-data/the-form-data?index=${v}`
         });
      },
      // 重新申请
      apply(v){
         if (!v.procDefId || v.procDefId == 'null') {
            this.$u.toast('流程定义为空');
            return;
         }
         this.form.id = v.id;
         this.form.procDefId = v.procDefId;
         this.form.title = v.title;
         // 加载审批人
         // this.userLoading = true;
         uni.showLoading({
            title: '审批人加载中'
         });
         // getFirstNode(v.procDefId).then((res) => {
         this.$reqGet('getFirstNode', {}, v.procDefId).then(res => {
            // this.userLoading = false;
            console.log('审批人', res);
            uni.hideLoading();
            if (res.data) {
               this.error = '';
               if (res.data.type == 3 || res.data.type == 4) {
                  this.isGateway = true;
                  this.form.firstGateway = true;
                  this.showAssign = false;
                  this.isCustom = false;
                  return;
               }
               if (res.data.type == 5) {
                  this.isCustom = true;
                  this.isGateway = false;
                  this.form.firstGateway = false;
                  this.showAssign = false;
                  return;
               }
               if (res.data.type == 1) {
                  this.showAssign = true;
                  this.isGateway = false;
                  this.form.firstGateway = false;
                  this.isCustom = false;
                  if (res.data.users && res.data.users.length > 0) {
                     this.assigneeList = res.data.users;
                     // 默认勾选
                     let ids = [];
                     res.data.users.forEach(e => {
                        ids.push(e.userId);
                     });
                     this.form.assignees = ids;
                     this.showAssign = true;
                     // 获取表单内容,重新创建申请
                     this.$reqPost('apply',this.form,'form').then(res=>{
                        console.log('重新提交申请',res);
                        if(res.code == 0){
                           uni.showToast({
                              title:res.data,
                              icon:'success',
                              duration:2000
                           });
                        }
                        // 初始化申请列表
                        // this.myApplication.pageNumber = 1;
                        // this.shenqingData = [];
                        // this.getMoreNews();
                        this.getProcessDataList();
                     })
                  } else {
                     this.form.assignees = [];
                     this.showAssign = true;
                     this.error = '请进入"流程管理"为审批节点分配候选审批人员';
                  }
               }
            }
            console.log(this.form);
         });
         this.modalVisible = true;
      },
      // 修改
      editMyApplication(v){
         console.log('修改申请');
         uni.navigateTo({
            url: `/pages/edit-my-application/edit-my-application?index=${v.tableId}`
         });
      },
      // 审批历史
      approvalHistoryClick(v) {
         uni.navigateTo({
            url: `/pages/approval-history/approval-history?index=${v}`
         });
      },
      // 删除申请
      deleteApplicationClick(id) {
         this.deleteApplicationModalShow = true;
         this.procInstId = id;
         console.log(id);
      }
   }
};
</script>
<style lang="scss" scoped>
::v-deep.home {
   height: 100%;
   width: 100%;
   .home_swipe {
      width: 100%;
      height: vww(160);
      .u-swiper {
         height: vww(160) !important;
         .u-swiper__wrapper {
            height: vww(160) !important;
            .uni-swiper-slides {
               .u-swiper__wrapper__item {
                  .u-swiper__wrapper__item__wrapper {
                     .u-swiper__wrapper__item__wrapper__image {
                        height: vww(160) !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;
         view {
            width: 50%;
         }
      }
      .center-content__three {
         display: flex;
         view {
            width: 50%;
         }
      }
      .center-content__four {
      }
   }
   // 中间部分样式
   .center-margin {
      margin-bottom: vww(16);
   }
   // 卡片底部
   .bottom-container {
      .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(1) {
               margin-right: 0;
            }
            view {
               display: inline-block;
            }
            image {
               width: vww(16);
               height: vww(16);
               margin-right: vww(4);
            }
         }
      }
   }
   // 模态框
   .wodeshenqingMotai {
      // width:100%;
      // height:vww(244);
      .slot-content {
         .u-textarea {
            width: vww(280);
            height: vww(90) !important;
            .uni-textarea-wrapper {
               height: vww(90) !important;
            }
         }
      }
   }
   // 通过模态框
   .adoptModal {
      // width:100%;
      // height:vww(244);
      .slot-content {
         .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;
            }
         }
      }
   }
   // 驳回模态框
   .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;
            }
         }
         .rejectBack {
            margin-top: vww(24);
            .rejectBack-title {
               font-size: vww(13);
            }
            // 下拉菜单
            .data-selet {
               border: 1px solid #d1d1d1;
               border-radius: 4px;
               width: vww(300);
               height: 40px;
               display: flex;
               align-items: center;
               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);
               }
            }
         }
      }
   }
}
<template>
   <view class="home">
      <!-- 轮播图 -->
      <view class="home_swipe"><u-swiper :list="list3" indicator indicatorMode="line" circular></u-swiper></view>
      <!-- 图表 -->
      <combined-title title="煤仓库存明细"></combined-title>
      <view class="charts-box">
         <qiun-data-charts type="pie" :opts="opts" :chartData="chartData" v-if="uchartsData.length > 0" />
         <u-empty mode="data" iconSize="200" textSize="25" width="350" height="350" icon="http://cdn.uviewui.com/uview/empty/data.png" v-if="uchartsData.length == 0"></u-empty>
      </view>
      <!-- 我的申请 -->
      <combined-title title="我的申请" detailsPath="/pages/my-application/my-application" v-if="shenqingMenu"></combined-title>
      <view class="card-group">
         <combination-card class="card" v-for="(item, index) in shenqingData" index="index" v-if="shenqingMenu">
            <template v-slot:top>
               <view>
                  <text>{{ item.title }}</text>
               </view>
            </template>
            <template v-slot:center>
               <view class="center-container">
                  <view class="center-content__one center-margin">
                     <view class="">
                        <text>所属流程:{{ item.processName }}</text>
                     </view>
                     <view class="">
                        <text>审批环节:{{ item.currTaskName || '' }}</text>
                     </view>
                  </view>
                  <view class="center-content__two center-margin">
                     <view class="">
                        状态:
                        <text :style="{ color: statusColor[item.status] }">{{ status[item.status] }}</text>
                     </view>
                     <view class="">
                        结果:
                        <text :style="{ color: resultColor[item.result] }">{{ result[item.result] }}</text>
                     </view>
                  </view>
                  <view class="center-content__three center-margin">
                     <text>创建时间:{{ item.createTime }}</text>
                  </view>
                  <view class="center-content__four">
                     <text>提交申请时间:{{ item.applyTime }}</text>
                  </view>
               </view>
            </template>
            <template v-slot:bottom>
               <view class="bottom-container">
                  <!-- 按钮区域 -->
                  <view class="bottom-content__chulizhong bottom-content__item">
                     <!-- <view @click="withDrawClick(item.procInstId)" v-if="item.status == 1">
                        <image src="@/static/home/cehui.png" mode=""></image>
                        <view>撤回</view>
                     </view> -->
                     <view @click="checkTheScheduleClick(item.procInstId)" v-if="item.status == 1">
                        <image src="@/static/home/jindu.png" mode=""></image>
                        <view>查看进度</view>
                     </view>
                     <view @click="theFormDataClick(item.tableId)" v-if="(item.status == 1 || item.status == 2 || item.status == 3) && item.processName == '发运通知单'">
                        <image src="@/static/home/biaodan.png" mode=""></image>
                        <view>申请详情</view>
                     </view>
                     <!-- <view @click="apply(item)" v-if="item.status == 3">
                        <image src="@/static/home/history.png" mode=""></image>
                        <view>重新申请</view>
                     </view> -->
                     <!-- <view @click="editMyApplication(item)" v-if="item.status == 1 && item.processName == '发运通知单'">
                        <image src="@/static/home/history.png" mode=""></image>
                        <view>编辑</view>
                     </view> -->
                     <view @click="approvalHistoryClick(item.procInstId)" v-if="item.status == 2 || item.status == 3">
                        <image src="@/static/home/history.png" mode=""></image>
                        <view>审批历史</view>
                     </view>
                     <!-- <view @click="deleteWithDrawApplication(item.tableId)" v-if="item.status == 3">
                        <image src="@/static/home/delete.png" mode=""></image>
                        <view>删除</view>
                     </view> -->
                  </view>
                  <!-- 已结束小组按钮 -->
                  <!-- <view class="bottom-content__chulizhong bottom-content__item" v-if="item.status == 2">
              <view @click="theFormDataClick">
                <image src="@/static/home/biaodan.png" mode=""></image>
                <view>表单数据</view>
              </view>
            </view> -->
               </view>
            </template>
         </combination-card>
      </view>
      <!-- 我的待办 -->
      <combined-title title="我的待办" detailsPath="/pages/my-todo/my-todo"></combined-title>
      <view class="card-group">
         <combination-card class="card" v-for="(item, index) in daibanData" index="index">
            <template v-slot:top>
               <view>
                  <text>{{ item.actBusiness.title }}</text>
               </view>
            </template>
            <template v-slot:center>
               <view class="center-container">
                  <view class="center-content__one center-margin">
                     <view class="">
                        <text>任务名称:{{ item.name || '' }}</text>
                     </view>
                     <view class="">
                        <text>所属流程:{{ item.processName || '' }}</text>
                     </view>
                  </view>
                  <view class="center-content__two center-margin">
                     <text>发起人:{{ item.actBusiness.createByName }}</text>
                  </view>
                  <view class="center-content__three">
                     <text>创建时间:{{ item.createTime }}</text>
                  </view>
               </view>
            </template>
            <template v-slot:bottom>
               <view class="bottom-container">
                  <!-- 待办按钮 -->
                  <view class="bottom-content__item">
                     <view @click="theFormDataClick(item.tableId)">
                        <image src="@/static/home/jindu.png" mode=""></image>
                        <view>申请详情</view>
                     </view>
                     <view @click="adopClick(item)">
                        <image src="@/static/home/tongguo.png" mode=""></image>
                        <view>通过</view>
                     </view>
                     <view @click="rejectClick(item)">
                        <image src="@/static/home/bohui.png" mode=""></image>
                        <view>驳回</view>
                     </view>
                     <view @click="approvalHistoryClick(item.procInstId)">
                        <image src="@/static/home/history.png" mode=""></image>
                        <view>历史</view>
                     </view>
                  </view>
               </view>
            </template>
         </combination-card>
      </view>
      <!-- 我的已办 -->
      <combined-title title="我的已办 " detailsPath="/pages/my-have-todo/my-have-todo"></combined-title>
      <view class="card-group">
         <combination-card class="card" v-for="(item, index) in yibanData" index="index">
            <template v-slot:top>
               <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>
                     <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>
            </template>
            <template v-slot:bottom>
               <view class="bottom-container">
                  <!-- 已办按钮 -->
                  <view class="bottom-content__item">
                     <view @click="theFormDataClick(item.tableId)" v-if="item.processName == '发运通知单'">
                        <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>
            </template>
         </combination-card>
      </view>
      <!-- 日计划 -->
      <combined-title title="日发运计划" detailsPath="/pages/jihua/jihua" v-if="rijihuaMenu"></combined-title>
      <view class="card-group bottomChild">
         <combination-card class="card" :showTop="false" v-for="(item, index) in fyData.slice(0, 2)" :key="item.id" v-if="rijihuaMenu">
            <template v-slot:top></template>
            <template v-slot:center>
               <view class="main-block-box">
                  <view class="jihua-main-line">
                     <view class="name">客户名称:{{ item.customerName || '' }}</view>
                  </view>
                  <view class="jihua-main-line">
                     <view class="main-flex">
                        <view>煤种:{{ item.order.coalName || '' }}</view>
                        <view>剩余量:{{ item.order.executiveSurplus || '' }}</view>
                     </view>
                  </view>
                  <view class="jihua-main-line">
                     <view class="main-flex">
                        <view class="carNum-box">
                           <view>计划车数:</view>
                           <u--input placeholder="请输入发运车数" border="surround" :disabled="true" v-model="item.numPlan" @change="inputTotalChange(item)"></u--input>
                        </view>
                        <view>实际发车数:{{ item.order.numReal || '' }}</view>
                     </view>
                  </view>
               </view>
            </template>
            <template v-slot:bottom></template>
         </combination-card>
      </view>
      <!-- 撤回模态框 -->
      <view class="wodeshenqingMotai">
         <u-modal width="684rpx" :show="withDrawShow" title="提示" :showCancelButton="true" @confirm="withDrawConfirm" @cancel="withDrawCancel">
            <view class="slot-content">
               <!-- <u--textarea v-model="withDrawData.reason" placeholder="请输入撤回原因"></u--textarea> -->
               <text>确认撤回该申请吗?</text>
            </view>
         </u-modal>
      </view>
      <!-- 通过模态框 -->
      <view class="adoptModal">
         <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>
         </u-modal>
      </view>
      <!-- 驳回模态框 -->
      <view class="rejectModal">
         <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>
                  <text>{{ modalType == 0 ? '注意:将默认分配给节点设定的所有可审批用户' : '注意:所有流程将驳回至发起人' }}</text>
               </view>
               <u--textarea v-model="rejectForm.comment" placeholder="请输入审批意见"></u--textarea>
               <!-- <view class="rejectBack">
            <view class="rejectBack-title"><text>驳回至</text></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>
         </u-modal>
      </view>
      <!-- 删除已办申请模态框 -->
      <view class="deleteApplicationModal">
         <u-modal
            :show="deleteApplicationModalShow"
            title="提示"
            content="确定删除该申请?"
            :showCancelButton="true"
            @confirm="deleteApplicationModalConfirm"
            @cancel="deleteApplicationModalCancel"
         ></u-modal>
      </view>
      <!-- 选择器 -->
      <!-- <u-picker @cancel="statusSeletShow = false" @confirm="statusConfirm" :show="statusSeletShow" :columns="statusList"></u-picker> -->
      <!-- 菜单栏 -->
      <!-- <popup-menu @menuShow="menushow" ref="menuRef"></popup-menu> -->
      <u-gap height="15" bgColor="#eeeeee"></u-gap>
      <view class="utils">
         <view class="utils-container">
            <view class="utils-container-body" @click="redirectLogin">
               <view class="top"><u-icon name="backspace" color="#FF4233" size="70"></u-icon></view>
               <view class="bottom-text"><text>退出</text></view>
            </view>
            <!-- <view class="utils-container-body" @click="huanBang">
               <view class="top"><u-icon name="lock-open" color="#1987FF" size="70"></u-icon></view>
               <view class="bottom-text"><text>换绑</text></view>
            </view> -->
         </view>
      </view>
      <u-gap height="60" bgColor="#eeeeee"></u-gap>
   </view>
</template>
<script>
import { timeConsuming } from '@/utils/nowDate.js';
import { BaseUrl } from '@/utils/request.js';
// import popupMenu from '@/components/common/popup-menu/popup-menu.vue';
import combinedTitle from '@/components/common/combined-title/combined-title.vue';
import combinationCard from '@/components/common/combination-card/combination-card.vue';
import { setAccessToken, redirectLogin } from '@/utils/status.js';
import { logout } from '@/api/global.js';
export default {
   name: 'home',
   onLaunch() {
      let that = this;
      uni.addInterceptor('redirectTo', {
         //监听关闭本页面跳转
         success(e) {
            that.watchRouter();
         }
      });
   },
   computed: {
      rijihuaMenu() {
         return this.$store.state.rijihuaMenu;
      },
      shenqingMenu() {
         return this.$store.state.shenqingMenu;
      }
   },
   data() {
      return {
         // ucharts图表
         chartData: {},
         opts: {
            color: ['#FAC858', '#EE6666', '#73C0DE', '#91CB74', '#1890FF', '#3CA272', '#FC8452', '#9A60B4', '#ea7ccc'],
            padding: [5, 5, 5, 5],
            extra: {
               pie: {
                  activeOpacity: 0.5,
                  activeRadius: 10,
                  offsetAngle: 0,
                  labelWidth: 15,
                  border: true,
                  borderWidth: 3,
                  borderColor: '#FFFFFF'
               }
            }
         },
         uchartsData: [],
         userId: null,
         // menuShow:false,// 菜单显示
         status: ['草稿', '处理中', '已结束', '已撤回'],
         statusColor: ['#dd8b8c', '#FF9900', '#007AFF', '#06BE00'],
         result: ['未提交', '处理中', '通过', '驳回'],
         resultColor: ['#dd8b8c', '#FF9900', '#06BE00', '#be2b2d'],
         list3: ['../../../../static/groupAppTotalImg/banner.png'],
         // 撤回模态框
         withDrawShow: false,
         fyData: [],
         withDrawData: {
            // reason: '',
            // id: '', // 撤回申请ID
            procInstId: ''
         },
         withDrawContent: '',
         // 重新申请
         form: {
            sendMessage: true,
            sendSms: true,
            sendEmail: true,
            procDefId: '',
            assignees: [],
            priority: '0'
         },
         assigneeList: [],
         showAssign: false,
         isGateway: false,
         isCustom: false,
         // 通过模态框
         adoptModalShow: false,
         // 通过请求
         adoptForm: {
            ids: '',
            comment: ''
         },
         // 驳回模态框
         rejectModalShow: false,
         rejectModalContent: '',
         // dataSeletText: '请选择状态',
         // 驳回请求
         rejectForm: {
            procInstIds: '',
            comment: ''
         },
         modalType: 0,
         // 删除申请模态框
         deleteApplicationModalShow: false,
         procInstId: '',
         // 选择器
         statusSeletShow: false,
         statusList: [['中国', '美国', '日本']],
         // data
         shenqingData: [],
         daibanData: [],
         yibanData: [],
         menuShow: false,
         // 申请
         myApplicationParams: {
            status: '',
            result: '',
            pageNumber: 1,
            pageSize: 2,
            sort: 'createTime',
            order: 'desc'
         },
         // 待办
         todoParams: {
            pageNumber: 1,
            pageSize: 2
         },
         haveTodoParams: {
            pageNumber: 1,
            pageSize: 2,
            sort: 'createTime',
            order: 'desc'
         }
      };
   },
   // 监听页面初次渲染完成。注意如果渲染速度快,会在页面进入动画完成前触发
   // onReady() {
   // },
   // 点击导航栏菜单后
   onNavigationBarButtonTap(e) {
      console.log('退出导航栏按钮事件', e);
      // this.$refs.menuRef.menuClick();
   },
   // 监听左上角的回退事件
   onUnload(event) {
      //多层级跳转之后,监听左上角返回事件,直接退回到index
      console.log('监听左上角', event);
      this.logout();
   },
   onShow() {
      // 菜单注释(app待用)
      // if (this.menuShow == true) {
      //    this.$refs.menuRef.menuClick();
      // }
      this.init();
   },
   components: {
      combinedTitle,
      combinationCard
      // popupMenu
   },
   methods: {
      watchRouter() {
         console.log('路由跳转');
      },
      init() {
         this.getUserInfo(); // 用户信息
         this.getProcessDataList(); // 申请列表
         this.todoList(); // 我的待办
         this.doneList(); // 我的已办
         this.xscarshippingdayplan(); // 日计划
      },
      getUserInfo() {
         this.$reqGet('getUserInfo').then(res => {
            if (res.code == 0) {
               uni.setStorageSync('userInfo', res.data.sysUser);
               this.userId = res.data.sysUser.userId;
               this.$nextTick(() => {
                  this.coalbunker();
               });
            }
         });
      },
      getServerData() {
         console.log('加载图表', this.uchartsData);
         //模拟从服务器获取数据时的延时
         setTimeout(() => {
            //模拟服务器返回数据,如果数据格式和标准格式不同,需自行按下面的格式拼接
            let res = {
               series: [
                  {
                     data: this.uchartsData
                  }
               ]
            };
            this.chartData = JSON.parse(JSON.stringify(res));
         }, 500);
      },
      // 煤仓当前剩余量
      coalbunker() {
         this.uchartsData = [];
         this.$reqGet('coalbunker', { customerId: this.userId }).then(res => {
            let newArr = res.data.records;
            newArr.forEach(item => {
               if (item.stock != null) {
                  let a = { name: '', value: '', labelText: '' };
                  a.name = item.bunkerName + '剩余量';
                  a.value = item.stock;
                  // a.labelText ='剩余量:' + item.stock;
                  this.uchartsData.push(a);
               }
            });
            this.getServerData(); // 加载图表
         });
      },
      xscarshippingdayplan(allList) {
         //已经设置的
         console.log(allList, 'allList==========');
         let params = {
            current: 1,
            size: 2,
            shippingDate: this.todayDate()
         };
         this.$reqGet('xscarshippingdayplan', params)
            .then(res => {
               if (res.code == 0) {
                  this.fyData = res.data.records;
                  uni.hideLoading();
               }
            })
            .catch(e => {
               uni.hideLoading();
            });
      },
      todayDate() {
         let yes = new Date().getTime();
         let date = new Date(yes);
         let y = date.getFullYear();
         let m = date.getMonth() + 1;
         m = m < 10 ? '0' + m : m;
         let d = date.getDate();
         d = d < 10 ? '0' + d : d;
         const time = y + '-' + m + '-' + d;
         console.log('todayDate---------', time);
         return time;
      },
      getProcessDataList() {
         this.$reqGet('getProcessDataList', this.myApplicationParams).then(res => {
            if (res.code === 0) {
               // console.log('申请', res);
               this.shenqingData = res.data.records;
            }
         });
      },
      todoList() {
         this.$reqGet('todoList', this.todoParams).then(res => {
            if (res.code === 0) {
               // console.log('待办', res);
               this.daibanData = res.data.content;
            }
         });
      },
      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;
            }
         });
      },
      menushow(e) {
         this.menuShow = e;
      },
      // 撤回模态框
      withDrawClick(procInstId) {
         this.withDrawShow = true;
         this.withDrawData.procInstId = procInstId;
      },
      withDrawConfirm() {
         this.$reqPost('cancel', this.withDrawData).then(res => {
            this.withDrawShow = false;
            if (res.code == 0) {
               uni.showToast({
                  title: res.data,
                  duration: 2000
               });
            }
            // 刷新列表
            this.getProcessDataList();
            this.todoList();
            this.doneList();
         });
      },
      withDrawCancel() {
         this.withDrawShow = false;
      },
      // 通过
      adopClick(v) {
         console.log('通过点击', v);
         this.adoptModalShow = true;
         this.adoptForm.ids = v.id;
         this.modalType = 0;
         // let urlparam = v.procDefId+'/'+v.key;
         // this.$reqGet('getNextNode',{},urlparam).then(res=>{
         //    console.log('通过欲请求');
         // })
      },
      // 通过模态框
      adoptModalConfirm() {
         this.adoptModalShow = false;
         this.adoptForm.comment = this.adoptModalContent;
         this.$reqPost('passAll', this.adoptForm).then(res => {
            if (res.code == 0) {
               this.$u.toast('操作成功!');
            } else {
               this.$u.toast('通过失败!!');
            }
            this.todoList(); // 我的待办
            this.doneList();
         });
      },
      adoptModalCancel() {
         this.adoptModalShow = false;
      },
      // 驳回
      rejectClick(v) {
         this.modalType = 1;
         this.rejectModalShow = true;
         this.rejectForm.procInstIds = v.procInstId;
      },
      // 驳回模态框
      rejectModalConfirm() {
         this.rejectModalShow = false;
         this.$reqPost('backAll', this.rejectForm).then(res => {
            if (res.code == 0) {
               this.$u.toast('操作成功!');
            } else {
               this.$u.toast('操作失败!!!');
            }
            this.todoList(); // 我的待办
            this.doneList();
         });
      },
      rejectModalCancel() {
         this.rejectModalShow = false;
      },
      // 删除申请
      deleteApplicationClick(id) {
         this.deleteApplicationModalShow = true;
         this.procInstId = id;
         console.log(id);
      },
      // 删除申请模态框
      deleteApplicationModalConfirm() {
         this.deleteApplicationModalShow = false;
         this.$reqPost('deleteHistoric', { ids: this.procInstId }, 'form').then(res => {
            if (res.code == 0) {
               this.$u.toast('操作成功!');
               this.yibanData = [];
               this.doneList(); // 我的已办
            } else {
               this.$u.toast('操作失败!!!');
            }
         });
      },
      deleteApplicationModalCancel() {
         this.deleteApplicationModalShow = false;
      },
      // 查看进度
      checkTheScheduleClick(v) {
         uni.navigateTo({
            url: `/pages/check-the-schedule/check-the-schedule?index=${v}`
         });
      },
      // 表单数据
      theFormDataClick(v) {
         uni.navigateTo({
            url: `/pages/the-form-data/the-form-data?index=${v}`
         });
      },
      // 删除撤回申请
      deleteWithDrawApplication(id) {
         this.deleteWithDrawApplicationGlobal(id)
            .then(res => {
               if (res.code == 0) {
                  // 刷新列表
                  this.getProcessDataList();
               }
            })
            .catch(err => {
               console.log('删除撤回申请异常');
            });
      },
      // 重新申请
      // apply(v) {
      //    if (!v.procDefId || v.procDefId == 'null') {
      //       this.$u.toast('流程定义为空');
      //       return;
      //    }
      //    this.form.id = v.id;
      //    this.form.procDefId = v.procDefId;
      //    this.form.title = v.title;
      //    // 加载审批人
      //    // this.userLoading = true;
      //    uni.showLoading({
      //       title: '审批人加载中'
      //    });
      //    // getFirstNode(v.procDefId).then((res) => {
      //    this.$reqGet('getFirstNode', {}, v.procDefId).then(res => {
      //       // this.userLoading = false;
      //       console.log('审批人', res);
      //       uni.hideLoading();
      //       if (res.data) {
      //          this.error = '';
      //          if (res.data.type == 3 || res.data.type == 4) {
      //             this.isGateway = true;
      //             this.form.firstGateway = true;
      //             this.showAssign = false;
      //             this.isCustom = false;
      //             return;
      //          }
      //          if (res.data.type == 5) {
      //             this.isCustom = true;
      //             this.isGateway = false;
      //             this.form.firstGateway = false;
      //             this.showAssign = false;
      //             return;
      //          }
      //          if (res.data.type == 1) {
      //             this.showAssign = true;
      //             this.isGateway = false;
      //             this.form.firstGateway = false;
      //             this.isCustom = false;
      //             if (res.data.users && res.data.users.length > 0) {
      //                this.assigneeList = res.data.users;
      //                // 默认勾选
      //                let ids = [];
      //                res.data.users.forEach(e => {
      //                   ids.push(e.userId);
      //                });
      //                this.form.assignees = ids;
      //                this.showAssign = true;
      //                // 获取表单内容,重新创建申请
      //                this.$reqPost('apply', this.form, 'form').then(res => {
      //                   console.log('重新提交申请', res);
      //                   if (res.code == 0) {
      //                      uni.showToast({
      //                         title: res.data,
      //                         icon: 'success',
      //                         duration: 2000
      //                      });
      //                   }
      //                   // 初始化申请列表
      //                   // this.myApplication.pageNumber = 1;
      //                   // this.shenqingData = [];
      //                   // this.getMoreNews();
      //                   this.getProcessDataList();
      //                });
      //             } else {
      //                this.form.assignees = [];
      //                this.showAssign = true;
      //                this.error = '请进入"流程管理"为审批节点分配候选审批人员';
      //             }
      //          }
      //       }
      //       console.log(this.form);
      //    });
      //    this.modalVisible = true;
      // },
      // 修改
      editMyApplication(v) {
         console.log('修改申请');
         uni.navigateTo({
            url: `/pages/edit-my-application/edit-my-application?index=${v.tableId}`
         });
      },
      // 审批历史
      approvalHistoryClick(v) {
         uni.navigateTo({
            url: `/pages/approval-history/approval-history?index=${v}`
         });
      },
      redirectLogin() {
         redirectLogin();
      },
      huanBang() {
         uni.navigateTo({
            url: '/pages/register/register'
         });
      }
   }
};
</script>
<style lang="scss" scoped>
::v-deep.home {
   width: 100%;
   display: flex;
   flex-direction: column;
   // 横向菜单栏
   .utils {
      .utils-container {
         display: flex;
         // justify-content: space-between;
         justify-content: center;
         width: 66%;
         margin: 0 auto;
         .utils-container-body {
            display: flex;
            align-items: center;
         }
      }
   }
   .home_swipe {
      width: 100%;
      .u-swiper {
         height: vww(160) !important;
         .u-swiper__wrapper {
            height: vww(160) !important;
            .u-swiper__wrapper__item {
               .u-swiper__wrapper__item__wrapper {
                  .u-swiper__wrapper__item__wrapper__image {
                     height: vww(160) !important;
                  }
               }
            }
         }
      }
   }
   // echarts图表
   .charts-box {
      width: 91%;
      height: vww(330);
      margin: 0 auto;
      .u-empty {
         height: 100%;
      }
   }
   .u-input {
      height: vww(16);
      width: vww(100);
   }
   //卡片
   .card-group {
      .card {
         &:nth-of-type(2) {
            .combination-card {
               margin-bottom: 0px !important;
            }
         }
      }
   }
   .bottomChild {
      margin-bottom: vww(20);
   }
   // 卡片中间
   .center-container {
      display: flex;
      flex-direction: column;
      .center-content__one {
         display: flex;
         view {
            width: 50%;
         }
      }
      .center-content__two {
         display: flex;
         // margin: vww(10) 0;
         view {
            width: 50%;
         }
      }
      .center-content__three {
         display: flex;
         view {
            width: 50%;
         }
      }
      .center-content__four {
      }
   }
   // 中间部分样式
   .center-margin {
      margin-bottom: vww(16);
   }
   // 卡片底部
   .bottom-container {
      .bottom-content__item {
         display: flex;
         justify-content: space-around;
         view {
            display: flex;
            justify-content: center;
            align-content: center;
            margin-right: vww(10);
            view {
               display: inline-block;
            }
            image {
               width: vww(16);
               height: vww(16);
               margin-right: vww(4);
            }
         }
      }
   }
   // 模态框
   .wodeshenqingMotai {
      // width:100%;
      // height:vww(244);
      .slot-content {
         .u-textarea {
            width: vww(280);
            height: vww(90) !important;
            .uni-textarea-wrapper {
               height: vww(90) !important;
            }
         }
      }
   }
   // 通过模态框
   .adoptModal {
      // width:100%;
      // height:vww(244);
      .slot-content {
         width: vww(330);
         .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;
            .u-textarea__field {
               height: vww(90) !important;
            }
         }
      }
   }
   // 驳回模态框
   .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;
            .u-textarea__field {
               height: vww(90) !important;
            }
         }
         .rejectBack {
            margin-top: vww(24);
            .rejectBack-title {
               font-size: vww(13);
            }
            // 下拉菜单
            .data-selet {
               border: 1px solid #d1d1d1;
               border-radius: 4px;
               width: vww(300);
               height: 40px;
               display: flex;
               align-items: center;
               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);
               }
            }
         }
      }
   }
   //日发运计划
   .main-block-box {
      // box-shadow: 0px 0px 8px 0px rgba(216,218,238,0.80);
      height: vww(80);
      // padding: vww(10);
      box-sizing: border-box;
      margin-top: vww(12);
      border-radius: vww(8);
      &:first-child {
         margin-top: vww(5);
      }
      .jihua-main-line {
         width: 100%;
         display: flex;
         view {
            font-size: vww(14);
         }
         .name {
            font-weight: 600 !important;
         }
         .main-flex {
            width: 100%;
            display: flex;
            justify-content: space-between;
            view {
               font-size: vww(14);
               line-height: vww(32);
            }
            .carNum-box {
               display: flex;
               view {
                  font-size: vww(14);
                  line-height: vww(32);
               }
            }
         }
      }
   }
}
</style>