ll

liukangdong

2024-08-30 fbc625dea6117cb8724301d3a07d9071419f9715

 admin/src/views/platform/components/PlatformQueuing.vue

@@ -2,75 +2,135 @@
  <GlobalWindow
    title="月台叫号-xx号月台"
    :visible.sync="isShowModal"
    :showConfirm="false"
    width="800px"
    :confirm-working="subLoading"
    @confirm="handleSub"
  >
    <div class="queuing_modal">
      <div class="df_ac mb20">
        <span>搜索车辆：</span>
        <el-input
          class="flex1 mr20"
          v-model="param.aa"
          v-model="carCodeFront"
          placeholder="请输入车牌号"
        ></el-input>
        <el-button type="primary">查找</el-button>
        <el-button>重置</el-button>
        <el-button type="primary" @click="getList">查找</el-button>
        <el-button @click="reset">重置</el-button>
      </div>
      <div class="list">
        <div class="item">
        <div class="item" v-for="item in dataList" :key="item.id">
          <div class="head df_sb">
            <div class="plate">皖A12122</div>
            <div class="status">已签到</div>
            <div v-if="item.carCodeFront" class="code">
              <span>{{ item.carCodeFront.slice(0, 1) }}</span>
              <span>{{ item.carCodeFront.slice(1, 2) }}</span>
              <span>·</span>
              <span>{{ item.carCodeFront.slice(2) }}</span>
            </div>
            <div class="status">{{ statusMap[item.status] }}</div>
          </div>
          <div class="info">
            <div class="ite">
            <div v-if="item.type == 4" class="ite">
              <span>合同单号：</span>
              <span>{{ item.contractNum }}</span>
            </div>
            <div v-else class="ite">
              <span>运输单号：</span>
              <span>12312</span>
              <span>{{ item.code }}</span>
            </div>
            <div class="ite">
              <span>驾驶员：</span>
              <span>12312</span>
              <span>{{ item.driverName }}</span>
            </div>
            <div class="ite">
              <span>手机号：</span>
              <span>12312</span>
              <span>{{ item.drivierPhone }}</span>
            </div>
            <div class="ite">
              <span>总运输量：</span>
              <span>12312</span>
              <span>{{ item.totalNum }}万支</span>
            </div>
            <div class="ite" style="width: 66%">
            <div v-if="item.type != 4" class="ite" style="width: 66%">
              <span>运输公司：</span>
              <span>12312</span>
              <span>{{ item.carrierName }}</span>
            </div>
          </div>
          <div class="footer df_sb">
            <div class="detail">运单详情</div>
            <el-button type="primary">叫号</el-button>
            <div v-if="item.type != 4" class="detail">运单详情</div>
            <div v-else></div>
            <el-button type="primary" @click="handleCall(item)">叫号</el-button>
          </div>
        </div>
      </div>
      <pagination
        @size-change="handleSizeChange"
        @current-change="handlePageChange"
        :pagination="pagination"
      >
      </pagination>
    </div>
  </GlobalWindow>
</template>

<script>
import GlobalWindow from '@/components/common/GlobalWindow'
import { getPlatform, PlatformEdit, PlatformDel } from '@/api'
import Pagination from '@/components/common/Pagination'
import { platformCallList, platformCallNumber } from '@/api'
import { statusMap } from '../config'
import { Message } from 'element-ui'
export default {
  components: {
    GlobalWindow
    GlobalWindow,
    Pagination
  },
  data () {
    return {
      statusMap,
      isShowModal: false,
      subLoading: false,
      param: {}
      pagination: {
        total: 0,
        pageSize: 10,
        page: 1
      },
      carCodeFront: '',
      activePlat: {},
      dataList: []

    }
  },
  methods: {
    handleCall (item) {
      const activePlatform = this.activePlat
      platformCallNumber({ platformId: activePlatform.id, jobId: item.id }).then(res => {
        Message.success('叫号成功')
        this.$emit('success')
        this.getList()
      })
    },
    getList () {
      const { activePlat, pagination, carCodeFront } = this
      platformCallList({
        model: { callType: '2', platformId: activePlat.id, carCodeFront },
        page: pagination.page,
        capacity: pagination.pageSize
      }).then(res => {
        this.dataList = res.records
        this.pagination.total = res.total
      })
    },
    reset () {
      this.carCodeFront = ''
      this.pagination.page = 1
      this.pagination.pageSize = 10
      this.getList()
    },
    handleSizeChange (e) {
      this.pagination.pageSize = e
      this.getList()
    },
    handlePageChange (e) {
      this.pagination.page = e
      this.getList()
    },
    handleSub () {
      const { param } = this
      this.subLoading = true
@@ -84,7 +144,7 @@
      }, () => {
        this.subLoading = false
      })
    },
    }
  }

}
@@ -116,6 +176,28 @@
        .status {
          color: $primaryColor;
        }
        .code {
          display: flex;
          font-weight: 600;
          height: 30px;
          line-height: 30px;
          font-size: 15px;
          color: #111111;
          background-color: #fff;
          border-radius: 4px;
          border: 1px solid $primaryColor;
          padding-right: 4px;
          span {
            &:nth-of-type(1) {
              background: $primaryColor;
              padding: 0 8px;
              color: #fff;
            }
            &:nth-of-type(2) {
              padding-left: 4px;
            }
          }
        }
      }
      .info {
        display: flex;