ll

liukangdong

2024-08-29 986118de12da6830ffb0c86af8e70567352c9bb9

 pda/pages/index/center.vue

@@ -2,7 +2,8 @@
  <view class="main_app">
    <view class="main_content">
      <view class="title" @click="showPlatformgroup = true"
        >{{ activePlatformGroup.name }}<u-icon
        >{{ activePlatformGroup.name
        }}<u-icon
          name="arrow-down"
          size="20"
          class="ml12"
@@ -12,10 +13,10 @@
      <view class="platform_list">
        <view
          class="item"
          :class="{ active: item.id === activePlatformId }"
          :class="{ active: item.id === activePlatform.id }"
          v-for="(item, index) in activePlatformGroup.platformList"
          :key="index"
               @click="platformClick(item.id)"
          @click="platformClick(item)"
          >{{ item.name }}</view
        >
      </view>
@@ -35,43 +36,92 @@
      </view>
    </view>
    <!--  -->
    <view v-if="true" class="platform_ing">
      <view class="head">
        <view class="code">
          <text>皖</text>
          <text>AD1212</text>
    <view style="padding-bottom: 140rpx">
      <view
        v-for="item in platformTaskInfo.platformJobList"
        :key="item.id"
        class="platform_ing"
      >
        <view class="head">
          <view class="code">
            <text>{{ item.carCodeFront.slice(0, 1) }}</text>
            <text>{{ item.carCodeFront.slice(1, 2) }}</text>
            <text>·</text>
            <text>{{ item.carCodeFront.slice(2) }}</text>
          </view>
          <view
            class="status"
            v-if="item.status != 4 && item.status != 5"
            :class="{ red: item.status == 8 }"
            >{{ statusMap[item.status] }}</view
          >
          <view class="status" v-if="item.status == 4"
            >叫号中 {{ item.callDateTemp }}</view
          >
          <view class="status scs" v-if="item.status == 5"
            >已作业 {{ item.startDateTemp }}</view
          >
        </view>
        <view class="status">叫号中</view>
        <view class="line" v-if="item.type == 4">
          <text class="label">合同单号</text>
          <text class="value">{{ item.contractNum }}</text>
        </view>
        <view class="line" v-else>
          <text class="label">运输单号</text>
          <text class="value">{{ item.code }}</text>
          <text class="primaryColor" @click="handleDetail()">运单详情</text>
        </view>
        <view class="line">
          <text class="label">驾驶员</text>
          <text class="value"
            >{{ item.driverName }} {{ item.drivierPhone }}</text
          >
        </view>
        <view class="line">
          <text class="label">总运输量</text>
          <text class="value">{{ item.totalNum }}万支</text>
        </view>
        <view class="line" v-if="item.type != 4">
          <text class="label">运输公司</text>
          <text class="value">{{ item.carrierName }}</text>
        </view>
        <view class="btns">
          <view v-if="item.status == 4" class="btn" @click="handlePass(item)"
            >过号</view
          >
          <view
            v-if="item.status == 4"
            class="btn active"
            @click="handleWork(item)"
            >开始作业</view
          >

          <view v-if="item.status == 5" class="btn" @click="handleErr(item)"
            >异常挂起</view
          >
          <view
            v-if="item.status == 5 || item.status == 8"
            class="btn"
            @click="handleTransform(item)"
            >转移月台</view
          >
          <view
            v-if="item.status == 5 || item.status == 8"
            class="btn active"
            @click="handleFinish(item)"
            >完成作业</view
          >
        </view>
      </view>
      <view class="line">
        <text class="label">运输单号</text>
        <text class="value">11111</text>
        <text class="primaryColor" @click="handleDetail()">运单详情</text>
      </view>
      <view class="line">
        <text class="label">总运输量</text>
        <text class="value">11111</text>
      </view>
      <view class="line">
        <text class="label">驾驶员</text>
        <text class="value">11111</text>
      </view>
      <view class="btns">
        <view class="btn">过号</view>
        <view class="btn" @click="handleTransform">转移月台</view>
        <view class="btn active">开始作业</view>
      <view v-if="!platformTaskInfo.platformJobList || platformTaskInfo.platformJobList.length == 0" class="empty_wrap">
        <image src="@/static/default_nodata@2x.png" />
        <text>暂无作业车辆</text>
      </view>
    </view>
    <image
      v-if="true"
      class="empty"
      src="@/static/default_nodata@2x.png"
      mode="widthFix"
    ></image>
    <!--  -->
    <view class="main_footer">
      <view class="btn">入园叫号</view>
      <view class="btn active" @click="PlatformCallClick">月台叫号</view>
      <view class="btn" @click="PlatformCallClick(1)">入园叫号</view>
      <view class="btn active" @click="PlatformCallClick(2)">月台叫号</view>
    </view>
    <!-- 叫号 -->
    <u-popup
@@ -81,45 +131,69 @@
      round="10"
      @close="showPlatformCall = false"
    >
      <view class="PlatformCallModal">
        <view class="title">月台叫号(1号月台)</view>
      <view
        class="PlatformCallModal"
        :style="{ height: 'calc(100vh - ' + windowTop + 'px)' }"
      >
        <view class="title" v-if="callType == 2"
          >月台叫号({{ activePlatform.name }})</view
        >
        <view class="title" v-else>入园叫号</view>
        <view class="input_wrap">
          <u-icon name="search" class="mr12" size="19" color="#999999" />
          <input
            v-model="platformCallSearch"
            type="text"
            placeholder="搜索车辆牌照"
            placeholder-class="placeholder9"
            @confirm="callQuery"
          />
        </view>
        <view class="order_list">
          <scroll-view scroll-y="true" class="scroll_view">
            <view class="platform_ing" v-for="i in 8">
          <scroll-view scroll-y="true" @scrolltolower="callScrolltolower" class="scroll_view">
            <view
              class="platform_ing"
              v-for="item in platformCallList"
              :key="item.id"
            >
              <view class="head">
                <view class="code">
                  <text>皖</text>
                  <text>AD1212</text>
                <view v-if="item.carCodeFront" class="code">
                  <text>{{ item.carCodeFront.slice(0, 1) }}</text>
                  <text>{{ item.carCodeFront.slice(1, 2) }}</text>
                  <text>·</text>
                  <text>{{ item.carCodeFront.slice(2) }}</text>
                </view>
                <view class="status">叫号中</view>
                <view class="status" :class="{ scs: item.status == 4 }">{{
                  statusMap[item.status]
                }}</view>
              </view>
              <view class="line">
              <view class="line" v-if="item.type == 4">
                <text class="label">合同单号</text>
                <text class="value">{{ item.contractNum }}</text>
              </view>
              <view class="line" v-else>
                <text class="label">运输单号</text>
                <text class="value">11111</text>
                <text class="primaryColor">运单详情</text>
                <text class="value">{{ item.code }}</text>
                <text class="primaryColor" @click="handleDetail()"
                  >运单详情</text
                >
              </view>
              <view class="line">
                <text class="label">驾驶员</text>
                <text class="value">11111</text>
                <text class="value"
                  >{{ item.driverName }} {{ item.drivierPhone }}</text
                >
              </view>
              <view class="line">
                <text class="label">总运输量</text>
                <text class="value">11111</text>
                <text class="value">{{ item.totalNum }}万支</text>
              </view>
              <view class="line">
              <view class="line" v-if="item.type != 4">
                <text class="label">运输公司</text>
                <text class="value">11111</text>
                <text class="value">{{ item.carrierName }}</text>
              </view>
              <view class="btns">
                <view class="btn active">叫号</view>
                <view class="btn active" @click="handleCall(item)">叫号</view>
              </view>
            </view>
          </scroll-view>
@@ -134,7 +208,10 @@
      round="10"
      @close="showDetail = false"
    >
      <view class="PlatformCallModal">
      <view
        class="PlatformCallModal"
        :style="{ height: 'calc(100vh - ' + windowTop + 'px)' }"
      >
        <view class="title">运单详情</view>
        <view class="platform_ing" style="padding: 0">
          <view class="head">
@@ -194,88 +271,265 @@
      round="10"
      @close="showTransform = false"
    >
      <view class="PlatformCallModal TransformModal">
      <view class="TransformModal">
        <view class="title">转移月台</view>
        <view class="transform_list">
          <view class="line" v-for="item,index in 9">
            <view class="name">1号月台</view>
            <view class="status">(空闲)</view>
            <image v-if="index == 1" src="@/static/ic_select@2x.png" class="checked" />
          <view
            class="line"
            @click="transformPlatClick(item)"
            v-for="item in activePlatformGroup.platformList"
            :key="item.id"
          >
            <view class="name">{{ item.name }}</view>
            <view class="status" :class="{ green: item.workStatus == 1 }"
              >({{ item.workStatus == 0 ? "空闲" : "作业中" }})</view
            >
            <image
              v-if="transformPlatId == item.id"
              src="@/static/ic_select@2x.png"
              class="checked"
            />
          </view>
        </view>
        <view class="btns">
          <view class="btn" @click="showTransform = false">取消</view>
          <view class="btn active">确定</view>
          <view class="btn" @click="transformCancel">取消</view>
          <view class="btn active" @click="transformSub">确定</view>
        </view>
      </view>
    </u-popup>
      <!--  -->
      <u-picker :show="showPlatformgroup" keyName="name" :columns="[platformGroupList]" @cancel="showPlatformgroup = false" @confirm="platConfirm"></u-picker>
    <!--  -->
    <u-picker
      :show="showPlatformgroup"
      keyName="name"
      :columns="[platformGroupList]"
      @cancel="showPlatformgroup = false"
      @confirm="platConfirm"
    ></u-picker>
  </view>
</template>

<script>
import { getPlatformGroupList, getPlatformWorkData } from '@/api'
import {
  getPlatformGroupList,
  getPlatformWorkData,
  platformCallList,
  platformCallNumber,
  platformInPark,
  beginWork,
  finishWork,
  platformMove,
  platformErr,
  platformOverNumber
} from '@/api'
import { statusMap } from '@/utils/config.js'
import dayjs from 'dayjs'
import duration from 'dayjs/plugin/duration'
dayjs.extend(duration)

export default {
  data() {
    return {
      statusMap,
      windowTop: 44,
      showPlatformCall: false, // 月台叫号
      showDetail: false,
      showTransform: false, // 转移
      showPlatformgroup: false,
			
         platformGroupList: [],
         activePlatformGroup: {},
         platformTaskInfo: {},
         activePlatformId: '',

      platformGroupList: [],
      activePlatformGroup: {},
      platformTaskInfo: {},
      activePlatform: {},

      platformCallList: [],//叫号列表
      platformCallSearch: '',
      platformCallTotal: 0,
      platformCallPage: 1,
      callType: 1,

      transformPlatId: '', // 转移记录月台id
      transformId: '', // 转移记录任务id
    }
  },
  onLoad() {
      this.getPlatformGroup()
    this.getPlatformGroup()
    const res = uni.getWindowInfo()
    this.windowTop = res.windowTop
  },
  methods: {
      getPlatformGroup() {
         getPlatformGroupList({
            queryData: 1,
            queryType: 0
         }).then(res => {
            this.platformGroupList = res.data || []
            if(this.platformGroupList.length > 0){
               this.activePlatformGroup = this.platformGroupList[0]
               if(this.activePlatformGroup.platformList && this.activePlatformGroup.platformList.length > 0){
                  this.activePlatformId = this.activePlatformGroup.platformList[0].id
                  this.getPlatformTask()
               }
            }
         })
      },
      getPlatformTask() {
         getPlatformWorkData({platformId: this.activePlatformId}).then(res => {
            this.platformTaskInfo = res.data
         })
      },
      platConfirm(e) {
         const index = e.indexs[0]
         this.activePlatformGroup = this.platformGroupList[index]
         if(this.activePlatformGroup.platformList && this.activePlatformGroup.platformList.length > 0){
            this.activePlatformId = this.activePlatformGroup.platformList[0].id
            this.getPlatformTask()
         }
         this.showPlatformgroup =false
      },
      platformClick(id) {
         this.activePlatformId = id
         this.getPlatformTask()
      },
    getPlatformGroup() {
      getPlatformGroupList({
        queryData: 1,
        queryType: 0
      }).then(res => {
        this.platformGroupList = res.data || []
        if (this.platformGroupList.length > 0) {
          this.activePlatformGroup = this.platformGroupList[0]
          if (this.activePlatformGroup.platformList && this.activePlatformGroup.platformList.length > 0) {
            this.activePlatform = this.activePlatformGroup.platformList[0]
            this.getPlatformTask()
          }
        }
      })
    },
    getPlatformTask() {
      getPlatformWorkData({ platformId: this.activePlatform.id }).then(res => {
        this.platformTaskInfo = res.data
        this.circulInitTaskList()
        setInterval(() => {
          this.circulInitTaskList()
        }, 1000)
      })
    },
    circulInitTaskList() {
      if (this.platformTaskInfo && this.platformTaskInfo.platformJobList && this.platformTaskInfo.platformJobList.length > 0) {
        let time = new Date()
        this.platformTaskInfo.platformJobList.forEach(item => {
          if (item.callDate) {
            let timeNum = time.getTime() - new Date(item.callDate).getTime()
            if (timeNum > 3600000) {
              item.callDateTemp = dayjs.duration(timeNum).format('H小时m分s秒')
            } else {
              item.callDateTemp = dayjs.duration(timeNum).format('m分s秒')
            }
          }
          if (item.startDate) {
            let timeNum = time.getTime() - new Date(item.startDate).getTime()
            if (timeNum > 3600000) {
              item.startDateTemp = dayjs.duration(timeNum).format('H小时m分ss秒')
            } else {
              item.startDateTemp = dayjs.duration(timeNum).format('m分s秒')
            }
          }
        })
        this.$forceUpdate()
      }
    },
    platConfirm(e) {
      const index = e.indexs[0]
      this.activePlatformGroup = this.platformGroupList[index]
      if (this.activePlatformGroup.platformList && this.activePlatformGroup.platformList.length > 0) {
        this.activePlatform = this.activePlatformGroup.platformList[0]
        this.getPlatformTask()
      }
      this.showPlatformgroup = false
    },
    platformClick(item) {
      this.activePlatform = item
      this.getPlatformTask()
    },
    handleDetail() {
      this.showDetail = true
    },
    PlatformCallClick() {
      this.showPlatformCall = true
    handleFinish(item) {
      finishWork({ jobId: item.id }).then(res => {
        this.showToast('完成作业')
        this.getPlatformTask()
      })
    },
    handleTransform() {
    handleWork(item) { // 开始作业
      beginWork({ jobId: item.id }).then(res => {
        this.showToast('已开始作业')
        this.getPlatformTask()
      })
    },
    handlePass(item) {
      uni.showModal({
        content: '您确认要对该任务进行过号吗',
        success: (res) => {
          if (res.confirm) {
            platformOverNumber({ jobId: item.id, platformId: this.activePlatform.id }).then(res => {
              this.showToast('过号成功')
              this.getPlatformTask()
            })
          }
        }
      })

    },
    handleCall(item) {
      const { callType, activePlatform } = this
      this.platformCallList = []
      this.platformCallPage = 1
      if (callType == 1) { // 入园叫号
        platformInPark({ jobId: item.id }).then(res => {
          this.showToast('叫号成功')
          this.getPlatformCallList()
        })
      } else { // 月台叫号
        platformCallNumber({ platformId: activePlatform.id, jobId: item.id }).then(res => {
          this.showToast('叫号成功')
          this.getPlatformCallList()
          this.getPlatformTask()
        })
      }
    },
    PlatformCallClick(callType) {
      this.callType = callType
      this.showPlatformCall = true
      this.platformCallList = []
      this.platformCallPage = 1
      this.platformCallSearch = ''
      this.getPlatformCallList()
    },
    callQuery() {
      this.platformCallList = []
      this.platformCallPage = 1
      this.getPlatformCallList()
    },
    callScrolltolower() {
      const { platformCallTotal, platformCallList } = this
      if(platformCallTotal > platformCallList.length){
        this.getPlatformCallList()
      }
    },
    getPlatformCallList() {
      const { platformCallPage, callType, activePlatform, platformCallSearch } = this
      platformCallList({
        model: { callType, platformId: activePlatform.id, carCodeFront: platformCallSearch },
        capacity: 10,
        page: platformCallPage
      }).then(res => {
        if (res.data && res.data.records) {
          this.platformCallList = [ ...this.platformCallList, ...res.data.records]
          this.platformCallTotal = res.data.total
        }
      })
    },
    transformPlatClick(item) {
      this.transformPlatId = item.id
    },
    transformCancel() {
      this.transformPlatId = ''
      this.showTransform = false
    },
    transformSub() {
      const { transformPlatId, transformId } = this
      platformMove({ platformId: transformPlatId, jobId: transformId }).then(res => {
        this.showToast('转移月台成功')
        this.transformCancel()
        this.getPlatformTask()
      })
    },
    handleTransform(item) {
      let { activePlatform } = this
      this.transformId = item.id
      this.transformPlatId = activePlatform.id
      this.showTransform = true
    },
    handleErr(item) {
      uni.showModal({
        content: '您确认要对该任务进行异常挂起吗',
        success: (res) => {
          if (res.confirm) {
            platformErr({ jobId: item.id }).then(ress => {
              this.showToast('异常挂起成功')
              this.getPlatformTask()
            })
          }
        }
      })
    }
  }
}
</script>
@@ -366,15 +620,24 @@
        border-radius: 8rpx;
        border: 1rpx solid #dfdede;
        text {
          padding: 0 12rpx;
          &:nth-of-type(1) {
            background: #e9f5f6;
            padding: 0 12rpx;
          }
          &:nth-of-type(2) {
            padding-left: 4rpx;
          }
          &:nth-of-type(4) {
            padding-right: 6rpx;
          }
        }
      }
      .status {
        font-size: 30rpx;
        color: $uni-color-primary;
      }
      .scs {
        color: #00ba67;
      }
    }
    .line {
@@ -442,7 +705,7 @@
  }
}
.PlatformCallModal {
  height: calc(100vh - 50px);
  height: calc(100vh - 44px);
  padding: 30rpx;
  .title {
    text-align: center;
@@ -458,7 +721,7 @@
    padding: 0 30rpx;
  }
  .order_list {
    height: calc(100% - 120rpx);
    height: calc(100% - 140rpx);
    .scroll_view {
      height: 100%;
    }
@@ -508,8 +771,62 @@
      }
    }
  }
  .btns {
    display: flex;
    align-items: center;
    justify-content: space-between;
    .btn {
      width: 336rpx;
      height: 88rpx;
      border-radius: 44rpx;
      border: 1rpx solid $uni-color-primary;
      color: $uni-color-primary;
      font-size: 32rpx;
      display: flex;
      justify-content: center;
      align-items: center;
    }
    .active {
      color: #fff;
      background-color: $uni-color-primary;
    }
  }
}
.TransformModal {
  height: 900rpx;
  padding: 30rpx;
  position: relative;
  .title {
    text-align: center;
    margin: 0 0 30rpx;
  }
  .btns {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: absolute;
    z-index: 999;
    left: 30rpx;
    bottom: 30rpx;
    .btn {
      width: 336rpx;
      height: 88rpx;
      border-radius: 44rpx;
      border: 1rpx solid $uni-color-primary;
      color: $uni-color-primary;
      font-size: 32rpx;
      display: flex;
      justify-content: center;
      align-items: center;
    }
    .active {
      color: #fff;
      margin-left: 18rpx;
      background-color: $uni-color-primary;
    }
  }
  .transform_list {
    height: 760rpx;
    height: 660rpx;
    margin-bottom: 30rpx;
    overflow: auto;
    .line {
@@ -528,34 +845,14 @@
        color: $uni-color-primary;
        margin-left: 12rpx;
      }
      .green {
        color: #00ba67;
      }
      .checked {
        width: 40rpx;
        height: 40rpx;
      }
    }
  }
  .btns {
    display: flex;
    align-items: center;
    justify-content: space-between;
    .btn {
      width: 336rpx;
      height: 88rpx;
      border-radius: 44rpx;
      border: 1rpx solid $uni-color-primary;
      color: $uni-color-primary;
      font-size: 32rpx;
      display: flex;
      justify-content: center;
      align-items: center;
    }
    .active{
      color: #fff;
      background-color: $uni-color-primary;
    }
  }
}
.TransformModal{
  height: 1000rpx;
}
</style>