ShipOutHeaderList.vue 5.53 KB
<template>
  <a-card :bordered="false">
    <!-- 查询区域-END -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" >
        <a-row :gutter="24">
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="项目名称">
              <a-input placeholder="请输入项目名称" v-model="queryParam.projectName"></a-input>
            </a-form-item>
          </a-col>

          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="工作令">
              <a-input placeholder="请输入工作令" v-model="queryParam.workno"></a-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="queryReceipt" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <!-- 操作按钮区域 -->


    <!-- table区域-begin -->
    <a-card
      style="margin-top: 24px"
      :bordered="false"
      title="收件列表">
      <a-list size="large" :pagination="false">
        <a-list-item :key="index" v-for="(item, index) in data">
          <a-list-item-meta :description="item.description"  style="width:100%;white-space:nowrap;">
            <a-avatar slot="avatar" size="large"  shape="square" :src="item.avatar"/>
            <a slot="title"  style="width:100%;white-space:nowrap;" >{{ item.title }}</a>
          </a-list-item-meta>

          <div slot="actions">
            <a @click="toFinsh(item.id)">点击查看</a>
          </div>

          <div class="list-content">
            <div class="list-content-item">
              <span>车牌号</span>
              <p>{{ item.code }}</p>
            </div>

            <div class="list-content-item">
              <span>收货人</span>
              <p>{{ item.owner }}</p>
            </div>


            <!--            <div class="list-content-item">-->
            <!--              <a-progress :percent="item.progress.value" :status="!item.progress.status ? null : item.progress.status" style="width: 180px" />-->
            <!--            </div>-->
          </div>
        </a-list-item>
      </a-list>

    </a-card>

    <ship-details-list ref="deailsFrom"></ship-details-list>
  </a-card>
</template>

<script>

import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import HeadInfo from '@/components/tools/HeadInfo'
import {getAction} from '@/api/manage'
import ShipDetailsList from "./modules/ShipDetailsList";
export default {
  name: 'ShipOutHeaderList',
  mixins:[JeecgListMixin],
  components: {
    ShipDetailsList, HeadInfo
  },
  data () {
    return {
      expandedRowKeys: [],
      data:[],
      url: {
        list: "/scan_car/scanCar/listPda",
        delete: "1",
      },
      dictOptions:{},
      superFieldList:[],
    }
  },
  created() {
    this.queryReceipt();
  },
  methods: {
    toFinsh(headId){
      var url='http://mts.huahengweld.com/jeecg-boot/jmreport/view/784912500540305408?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJleHAiOjE2NzYyODA2NDcsInVzZXJuYW1lIjoiY2hlbmFvIn0.RXyJ_qIgepVWsrgGdlfAFCeirh2Mdmy6pXkvnJAyx7Q&id='+headId;
      window.open(url, '_blank');
    },
    searchReset(){
      this.data=[];
      this.queryParam.projectName='';
      this.queryParam.workno='';
    },
    queryReceipt(){
      let params = {
        'projectName': this.queryParam.projectName,
        'workno': this.queryParam.workno
      }

      this.loading = true;
      getAction(this.url.list, params).then((res) => {
        if (res.success) {
          this.data=[];
          for (let i in res.result) {
            var json={};
            var title=res.result[i].projectName;
            if(title!=null){
              if(title.length>12){
                title=title.substring(0,12)+'....'
              }
            }
            var status='';
            if (res.result[i].status=='0'){
              status='[新建]';
            }
            if (res.result[i].status=='1'){
              status='[已装箱]';
            }
            if (res.result[i].status=='2'){
              status='[已发货]';
            }
            if (res.result[i].status=='3'){
              status='[已收货]';
            }
            json.title =status+title;
            var work_no='';
            if(res.result[i].workno!=undefined){
              work_no=res.result[i].workno
            }
            json.description ='工作令:'+work_no;
            json.id = res.result[i].id;

            if(res.result[i].name!=undefined){
              json.owner = res.result[i].name;
            }
            if(res.result[i].createTime!=undefined){
              json.startAt = res.result[i].createTime;
            }
            if(res.result[i].plateNumber!=undefined){
              json.code = res.result[i].plateNumber;
            }
            this.data.push(json);
          }

        }
        if(res.code===510){
          this.$message.warning(res.message)
        }
        this.loading = false;
      })
    }
  }
}
</script>

<style lang="less" scoped>
.ant-avatar-lg {
  width: 48px;
  height: 48px;
  line-height: 48px;
}

.list-content-item {
  color: rgba(0, 0, 0, .45);
  display: inline-block;
  vertical-align: middle;
  font-size: 14px;
  margin-left: 40px;
  span {
    line-height: 20px;
  }
  p {
    margin-top: 4px;
    margin-bottom: 0;
    line-height: 22px;
  }
}
</style>