yos_web/src/template/logisyticCanUseDisBill/index.vue

<template>
  <div>
    <div class="flex-align-center flex-between mt-10">
      <el-input style="width:200px" size="small"  suffix-icon="el-icon-search" v-model="params.content.where.condition" placeholder="产品名称,编号" @keyup.enter.native="listData(params.content.pageNumber = 1)" @clear="listData(params.content.pageNumber = 1)" clearable></el-input>
      <el-button type="primary" size="small" :disabled="tableSelectData.length === 0" @click="onConfirm">添加选中发货单</el-button>
    </div>
    <el-table
      :data="tableData"
      style="width: 100%"
      size="mini"
      @selection-change="selectionChange"
      border>
      <el-table-column
        type="selection"
        width="55">
      </el-table-column>
      <el-table-column
        prop="billno"
        label="发货单号">
      </el-table-column>
      <el-table-column
        prop="sonum"
        label="订单号">
      </el-table-column>
      <el-table-column
        prop="enterprisename"
        label="企业名称">
      </el-table-column>
      <el-table-column
      prop="recheckby"
      label="收货人">
    </el-table-column>
    <el-table-column
      prop="contactsphonenumber"
      label="收货人联系电话">
    </el-table-column>
    <el-table-column
      prop="province"
      label="省市县">
      <template slot-scope="scope" v-if="scope.row.province">
        {{`${scope.row.province}-${scope.row.city}-${scope.row.county}`}}
      </template>
    </el-table-column>
    <el-table-column
      prop="address"
      label="地址">
    </el-table-column>
    </el-table>
    <div style="margin-top:16px;text-align:right">
      <el-pagination
        background
        small
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage"
        :page-size="params.content.pageSize"
        layout="total, prev, pager, next, jumper"
        :total="total">
      </el-pagination>
    </div>
  </div>
</template>

  <script>
    export default {
      props:['data','paytype'],
      data() {
        return {
          tableSelectData:[],
          tableData: [],
          total:0,
          currentPage:0,
          params:{
            "id":20221122133504,
            "content": {
              "pageNumber": 1,
              "pageSize": 20,
              "sa_logisticsid":0,
              "freightstatus":'',
              "sys_enterpriseid":'',
              "where": {
                  "condition": ""
              }
            }
          }
        }
      },
      methods:{
        async listData () {
          this.params.content.sa_logisticsid = this.$route.query.id?this.$route.query.id:0
          this.params.content.sys_enterpriseid = this.data.sys_enterpriseid
          this.params.content.paytype = this.params.content.freightstatus = this.paytype
          const res = await this.$api.requested(this.params)
          this.tableData = res.data
          this.total = res.total
          this.currentPage = res.pageNumber
        },
        handleSizeChange(val) {
          // console.log(`每页 ${val} 条`);
          this.params.content.pageSize = val
          this.listData()
        },
        handleCurrentChange(val) {
          // console.log(`当前页: ${val}`);
          this.params.content.pageNumber = val
          this.listData()
        },
        selectionChange (val) {
          this.tableSelectData = val
        },
        onConfirm () {
          this.$emit('onConfirm',this.tableSelectData)
        },
        clearSelection () {
          this.$refs.multipleTable.clearSelection();
        }
      }
    }
  </script>