FE-lab-xcx/pages/views/supplierWorkbenchPage/supplierWorkbench.vue

<!-- 整改列表 -->
<template>
  <view class="supplier" style="display: flex;flex-direction: column;flex: 1;">
    <view v-if="pageType==0">
      <view class="supplier_h" @click="handleClick('mine')">
        <img :src="imagesUrl('supplier/img_gysglpt_bg.png')">
        <img :src="imagesUrl('supplier/img_gysglpt_icom.png')">
        <img :src="imagesUrl('supplier/icon_gyspt_gd.png')">
        <view>{{form.companyName}}</view>
      </view>
      <view class="supplier_tab">
        <view class="supplier_tab_li" @click="handleClick('people')">
          <text>{{form.peopleSum}}</text>
          <text>运输人员</text>
        </view>
        <view class="supplier_tab_line"></view>
        <view class="supplier_tab_li" @click="handleClick('car')">
          <text>{{form.carSum}}</text>
          <text>运输车辆</text>
        </view>
        <view class="supplier_tab_line"></view>
        <view class="supplier_tab_li" @click="handleClick('bottle')">
          <text>{{form.bottleSum}}</text>
          <text>气瓶管理</text>
        </view>
      </view>
      <scroll-view scroll-y @scrolltolower="scrollGet" class="for-max-box">
        <view class="for-big-box">
          <view class="backlog" @click="handleClick('backlog')">
            <img class="backlog_l" :src="imagesUrl('supplier/icon_glpt_dbqd.png')">
            <view class="backlog_c">待办清单</view>
            <img class="backlog_r" :src="imagesUrl('supplier/icon_wdwg_gd.png')">
          </view>
          <view class="for-box" @click="goInfo(item)" v-for="(item,index) in dataList" :key="index">
            <view class="for-title-box">
              <view v-if="item.remark=='gq'"  class="viewColor1">供气</view>
              <view v-if="item.remark=='hs'" class="viewColor3">回收</view>
              <view v-if="item.remark=='wt'" class="viewColor2">问题</view>
              <view v-if="item.remark=='hs' || item.remark=='wt'">{{item.airName}}-{{item.configName}}</view>
              <view  v-if="item.remark=='gq'" ><text v-for="(item2,index2) in item.detailListVO" :key="index2" v-if="index2<2">{{item2.airName}}-{{item2.configName}}*{{item2.bottleNumber}}<text>{{index2<1?' ':'...'}}</text></text></view>
            </view>
            <view class="for-address-box">
              <img :src="imagesUrl('supplier/icon_wtzg_xx.png')">
              <view >{{item.campus}}-{{item.building}}-{{item.room}}</view>
            </view>
            <view class="for-time-box">
              <img :src="imagesUrl('supplier/icon_wtzg_sj.png')">
              <view>{{item.createTime}}</view>
            </view>
          </view>
        </view>
        <!-- <img class="null-img" v-if="!dataList[0]" :src="imagesUrl('supplier/null-data-1.png')"> -->
      </scroll-view>
      <img class="supernatant"  @click="handleClick('recycle')" :src="imagesUrl('supplier/icon_glpt_gqhsjl.png')">
    </view>
    <view class="empty" v-if="emptyList==4 && pageType==0">
      <img class="for-back-img" :src="imagesUrl('supplier/img_ysrygl_zwsj.png')">
      <view>暂无数据</view>
    </view>
    <hasten-page v-if="pageType==1"></hasten-page>
    <reject-page v-if="pageType==2" :infoData="infoData"></reject-page>
    <forbidden-page v-if="pageType==3"></forbidden-page>
  </view>

</template>

<script>
import { config } from '@/api/request/config.js'
import { supplierDetail,storageListTaskIndex } from '@/pages/api/index.js'
import { hastenPage } from './hasten.vue'
import { rejectPage } from './reject.vue'
import { forbiddenPage } from './forbidden.vue'
export default {
  name: "rectifyList",
  components: {
    hastenPage,//供应商正在审核
    rejectPage,//供应商驳回
    forbiddenPage,//供应商停用
  },
  data() {
    return {
      emptyList:0,
      pageType:4,
      dataList:[],
      //列表请求参数
      getData:{
        pageNum:1,
        pageSize:5,
      },
      form:{
        companyName:'',//企业名称
        peopleSum:'0',//人员数量总数
        carSum:'0',//运输车辆总数
        bottleSum:'0',//气瓶数量总数
      },
      infoData:'',//驳回原因
      state:'',
    }
  },
  onLoad() {

  },
  onShow() {
		console.log('1');
    this.infoList=[];

  },
  mounted(){
		console.log('2');
    this.getInfo();
    this.getList();
  },
  methods: {
    //滚动加载事件
    scrollGet(){
      if(this.getData.getType){
        this.getData.page += 1;
        this.getList();
      }
    },
    goInfo(d){
      if(d.remark=='gq'){
        uni.navigateTo({
          url:'/pages_supplier/views/backlogManage/backlogManageAirDetail?item='+encodeURIComponent(JSON.stringify(d))
        });
      }else if(d.remark=='hs'){
        uni.navigateTo({
          url:'/pages_supplier/views/backlogManage/backlogManageRecycleDetail?item='+encodeURIComponent(JSON.stringify(d))
        });
      }else if(d.remark=='wt'){
        uni.navigateTo({
          url:'/pages_supplier/views/backlogManage/backlogManageIssueDetail?item='+encodeURIComponent(JSON.stringify(d))
        });
      }

    },
    handleClick(doType) {
      if(doType=='people'){
        uni.navigateTo({
          url:'/pages_supplier/views/transportPerson/transportPerson'
        });
      }else if(doType=='car'){
        uni.navigateTo({
          url:'/pages_supplier/views/transportCar/transportCar'
        });
      }else if(doType=='bottle'){
        uni.navigateTo({
          url:'/pages_supplier/views/gasManage/gasManage'
        });
      }else if(doType=='mine'){
        uni.navigateTo({
          url: '/pages_supplier/views/mine/mine?state='+this.state
        });
      }else if(doType=='backlog'){//待办清单
        uni.navigateTo({
          url:'/pages_supplier/views/backlogManage/backlogManage'
        });
      }else if(doType=='recycle'){//供气回收
        uni.navigateTo({
          url:'/pages_supplier/views/gasRecycle/gasRecycle'
        });
      }


    },
    //获取首页详情
    async getInfo(){
      let _this = this;
      const {data} = await supplierDetail()
      let res=data.data
      if(data.code==200){
        this.state=res.state;
        if(res.state==0){//审核状态（0：未审核，1:审核通过，2：审核未通过）
          this.pageType=1;
        }else if(res.state==1){
          this.pageType=0;
        }else if(res.state==2){
          this.pageType=2;
          this.infoData=res.audit.auditContent//驳回原因
        }
        this.form.companyName=res.companyName
        this.form.peopleSum=res.peopleSum
        this.form.carSum=res.carSum
        this.form.bottleSum=res.bottleSum

      }else if(data.code==500){//资格状态status（0：启用，1:停用）
        this.pageType=3;
      }
    },
    //获取列表数据
    async getList(){
      let _this = this;
      const {data} = await storageListTaskIndex(_this.getData);
      if(data.code==200){
        let res=data.data;
        _this.dataList=res;
        if(_this.dataList.length<=0){
          _this.emptyList=4
        }
      }
    },
  }
}
</script>

<style lang="stylus" scoped>
.empty{
  text-align: center;
  margin-top: 116rpx;
  >img{
    width: 336rpx;
    height: 222rpx;
    margin-left: 208rpx;
  }
  >view{
    font-size: 30rpx;
    font-family: PingFang SC;
    font-weight: 500;
    color: #E0E0E0;
    line-height: 30rpx;
    margin-top: 48rpx;
  }
}
.supplier{
  .supplier_h{
    width: 750rpx;
    height: 200rpx;
    position: relative;
    >img:nth-child(1){
      width: 750rpx;
      height: 200rpx;
      position: absolute;
      left: 0;
      top: 0;
    }
    >img:nth-child(2){
      width: 110rpx;
      height: 110rpx;
      position: absolute;
      left: 18rpx;
      top: 44rpx;
    }
    >img:nth-child(3){
      width: 12rpx;
      height: 24rpx;
      position: absolute;
      left: 716rpx;
      top: 92rpx;
    }
    >view{
      width: 550rpx;
      font-size: 30rpx;
      font-family: PingFang SC;
      font-weight: 500;
      color: #FFFFFF;
      line-height: 30rpx;
      position: absolute;
      left: 164rpx;
      top: 84rpx;
    }
  }
  .supplier_tab{
    width: 710rpx;
    height: 180rpx;
    background: #FFFFFF;
    border-radius: 10rpx;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 20rpx 20rpx 0;
    .supplier_tab_line{
      width: 2rpx;
      height: 30rpx;
      background: #E0E0E0;
    }
    .supplier_tab_li{
      flex: 1;
      text-align: center;
      >text{
        display: block;
      }
      >text:nth-child(1){
        font-size: 30rpx;
        font-family: PingFang SC;
        font-weight: 500;
        color: #0183FA;
        line-height: 30rpx;
      }
      >text:nth-child(2){
        font-size: 30rpx;
        font-family: PingFang SC;
        font-weight: 500;
        color: #333333;
        line-height: 30rpx;
        margin-top: 36rpx;
      }
    }
  }
  /* 列表 */
  .for-max-box{
    flex:1;
    overflow-y scroll;
    .for-big-box{
      background:#fff;
      border-radius:20rpx;
      margin:20rpx;
      .backlog{
        height: 100rpx;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        .backlog_l{
          width: 34rpx;
          height: 32rpx;
          margin-left:20rpx;
        }
        .backlog_c{
          font-size: 30rpx;
          font-family: PingFang SC;
          font-weight: 500;
          color: #333333;
          line-height: 30rpx;
          margin-left:16rpx;
        }
        .backlog_r{
          width: 24rpx;
          height: 24rpx;
          margin-left:472rpx;
        }

      }
      .for-box:nth-child(1){
        .for-title-box{
          border:none;
        }
      }
      .for-box{
        overflow hidden
        .for-title-box{
          display:flex;
          margin:0 26rpx 0;
          border-top:1rpx solid #dedede;
          padding-top:45rpx;
          view:nth-child(1){
            width:98rpx;
            line-height:38rpx;
            height:38rpx;
            border-radius:6rpx;
            font-size:20rpx;
            text-align center;
            margin-right:10rpx;
          }
          view:nth-child(2){
            flex:1;
            font-size:30rpx;
            color:#333;
            height:36rpx;
            lin-height:36rpx;
            margin-right:10rpx;
            display:block;
            overflow:hidden;
            text-overflow:ellipsis;
            white-space:nowrap;
          }
          view:nth-child(3){
            font-size:30rpx;
            color:#333;
            height:36rpx;
            lin-height:36rpx;
            color:#D80000;
          }
          .viewColor1{
            background #ffe6e6;
            color:#ff5555;
          }
          .viewColor2{
            background #fef2dd;
            color:#f6a71d;
          }
          .viewColor3{
            background #e0f1e2;
            color:#30a23d;
          }
          .viewColor4{
            background #f2dddd;
            color:#a51919;
          }
          .viewColor5{
            background #e2f6f8;
            color:#3ac3d3;
          }
          .viewColor6{
            background #d9edfe;
            color:#0183fa;
          }
        }
        .for-address-box{
          display:flex;
          margin:33rpx 26rpx 0;
          img{
            width:28rpx;
            height:28rpx;
            margin-right:20rpx;
          }
          view{
            font-size:28rpx;
            line-height:28rpx;
            color:#666;
          }
        }
        .for-time-box{
          display:flex;
          margin:26rpx 26rpx 0;
          padding-bottom:32rpx;
          img{
            width:28rpx;
            height:28rpx;
            margin-right:20rpx;
          }
          view{
            font-size:28rpx;
            line-height:28rpx;
            color:#666;
          }
        }
      }
    }
    .null-img{
      display block
      width:276rpx;
      height:321rpx;
      position absolute
      top:100rpx;
      left:274rpx;
    }
  }
  /* 供求回收记录 */
  .supernatant{
    width: 152rpx;
    height: 152rpx;
    position: fixed;
    right: 0rpx;
    bottom: 60rpx;
  }
}
</style>