项目整体细节，新增主页煤仓剩余量图表。

付延余

2022-08-03 910f2ef56d0d49a4ce24b2f33860dce4d739b1b4

 pages/home/home.vue

@@ -2,9 +2,13 @@
   <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" /></view>

      <!-- 我的申请 -->

      <combined-title title="我的申请" detailsPath="/pages/my-application/my-application"></combined-title>

      <combination-card v-for="(item, index) in shenqingData" index="index">

      <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>

@@ -78,10 +82,12 @@
            </view>

         </template>

      </combination-card>

      </view>



      <!-- 我的待办 -->

      <combined-title title="我的待办" detailsPath="/pages/my-todo/my-todo"></combined-title>

      <combination-card v-for="(item, index) in daibanData" index="index">

      <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>

@@ -130,10 +136,12 @@
            </view>

         </template>

      </combination-card>

      </view>



      <!-- 我的已办 -->

      <combined-title title="我的已办 " detailsPath="/pages/my-have-todo/my-have-todo"></combined-title>

      <combination-card v-for="(item, index) in yibanData" index="index">

      <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>

@@ -198,8 +206,12 @@
            </view>

         </template>

      </combination-card>

      <combined-title title="日发运计划" detailsPath="/pages/jihua/jihua"></combined-title>

      <combination-card :showTop="false"  v-for="(item,index) in fyData.slice(0,2)" :key="item.id">

      </view>



      <!-- 日计划 -->

      <combined-title title="日发运计划" detailsPath="/pages/jihua/jihua" v-if="rijihuaMenu"></combined-title>

      <view class="card-group">

         <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">

@@ -216,8 +228,7 @@
                    <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>

                           <u--input placeholder="请输入发运车数" border="surround" :disabled="true" v-model="item.numPlan" @change="inputTotalChange(item)"></u--input>

                       </view>

                       <view>实际发车数：{{item.order.numReal || ''}}</view>

                    </view>

@@ -226,6 +237,7 @@
           </template>

           <template v-slot:bottom></template>

      </combination-card>

      </view>



      <!-- 撤回模态框 -->

      <view class="wodeshenqingMotai">

@@ -285,20 +297,48 @@
      <!-- <u-picker @cancel="statusSeletShow = false" @confirm="statusConfirm" :show="statusSeletShow" :columns="statusList"></u-picker> -->



      <!-- 菜单栏 -->

      <popup-menu @menuShow="menushow" ref="menuRef"></popup-menu>

      <!-- <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 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',

   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'],

@@ -353,7 +393,6 @@
         // data

         shenqingData: [],

         daibanData: [],

         daibanData: [],

         yibanData: [],

         menuShow: false,

         // 申请

@@ -378,64 +417,107 @@
         }

      };

   },

   // 监听页面初次渲染完成。注意如果渲染速度快，会在页面进入动画完成前触发

   // onReady() {



   // },

   // 点击导航栏菜单后

   onNavigationBarButtonTap(e) {

      console.log(e);

      this.$refs.menuRef.menuClick();

      // this.$refs.menuRef.menuClick();

   },

   onShow() {

      if (this.menuShow == true) {

         this.$refs.menuRef.menuClick();

      }

      // 菜单注释（app待用）

      // if (this.menuShow == true) {

      //    this.$refs.menuRef.menuClick();

      // }

      this.init();

   },

   components: {

      combinedTitle,

      combinationCard,

      popupMenu

      combinationCard

      // popupMenu

   },

   methods: {

      getUserInfo() {

         this.$reqGet('getUserInfo').then(res => {

            if (res.code == 0) {

               uni.setStorageSync('userInfo', res.data.sysUser);

            }

         });

      },

      init() {

         this.getUserInfo();

         this.getUserInfo(); // 用户信息

         this.getProcessDataList(); // 申请列表

         this.todoList(); // 我的待办

         this.doneList(); // 我的已办

         this.xscarshippingdayplan();  //日计划

      },

      xscarshippingdayplan(allList) { //已经设置的

      console.log(allList,'allList==========')

      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() {

         //模拟从服务器获取数据时的延时

         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 => {

         };

         this.$reqGet('xscarshippingdayplan', params)

            .then(res => {

            if (res.code == 0) {

               this.fyData = res.data.records

                  this.fyData = res.data.records;

               uni.hideLoading();

            }

         }).catch(e => {

            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

         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 => {

@@ -456,7 +538,7 @@
      doneList() {

         uni.showLoading({

            title:'加载中...'

         })

         });

         this.$reqGet('doneList', this.haveTodoParams).then(res => {

            uni.hideLoading();

            if (res.code === 0) {

@@ -554,14 +636,13 @@
         this.deleteApplicationModalShow = false;

         this.$reqPost('deleteHistoric',{ids:this.procInstId},'form').then(res=>{

            if(res.code == 0){

               this.$u.toast('操作成功！')

               this.$u.toast('操作成功！');

               this.yibanData = [];

               this.doneList(); // 我的已办

            } else {

               this.$u.toast('操作失败！！！')

               this.$u.toast('操作失败！！！');

            }

         })

			
         });

      },

      deleteApplicationModalCancel() {

         this.deleteApplicationModalShow = false;

@@ -642,7 +723,7 @@
                        // this.shenqingData = [];

                        // this.getMoreNews();

                        this.getProcessDataList();

                     })

                     });

                  } else {

                     this.form.assignees = [];

                     this.showAssign = true;

@@ -684,12 +765,16 @@
   display: flex;

   flex-direction: column;

   padding-bottom: vww(20);



   .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 {

@@ -700,20 +785,43 @@
      }

     }

    }



   // echarts图表

   .charts-box {

      width: 91%;

      height: vww(330);

      margin: 0 auto;

   }



   .u-input {

      height: vww(16);

      width: vww(100);

   }



   //卡片

   .card-group {

      .card {

         &:nth-of-type(2) {

            .combination-card {

               margin-bottom: 0px !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;

@@ -721,15 +829,19 @@
            width: 50%;

         }

      }



      .center-content__three {

         display: flex;



         view {

            width: 50%;

         }

      }



      .center-content__four {

      }

   }



   // 中间部分样式

   .center-margin {

      margin-bottom: vww(16);

@@ -740,14 +852,17 @@
      .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);

@@ -765,6 +880,7 @@
         .u-textarea {

            width: vww(280);

            height: vww(90) !important;



            .uni-textarea-wrapper {

               height: vww(90) !important;

            }

@@ -777,21 +893,25 @@
      // 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;

            .uni-textarea-wrapper {



            .u-textarea__field {

               height: vww(90) !important;

            }

         }

@@ -808,24 +928,29 @@
            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 {



            .u-textarea__field {

               height: vww(90) !important;

            }

         }



         .rejectBack {

            margin-top: vww(24);



            .rejectBack-title {

               font-size: vww(13);

            }



            // 下拉菜单

            .data-selet {

               border: 1px solid #d1d1d1;

@@ -837,15 +962,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);

@@ -863,9 +991,11 @@
      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;

@@ -882,21 +1012,22 @@
            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>