yos_web/src/HDrpManagement/writeoffbill/modules/order/addOrder.vue

<template>
  <div>
    <el-button size="mini" type="primary" :disabled="disabled" @click="addBtn">添 加</el-button>
    <el-drawer append-to-body :visible.sync="dialogFormVisible" size="60%">
      <div slot="title" style="font-size: 15px">
        添加订单
      </div>
      <div class="drawer__panel">
        <el-input style="width:250px;margin-bottom:10px" size="small" placeholder="请输入搜索内容" clearable @clear="getOrderList(params.content.pageNumber=1)" v-model="params.content.where.condition" @keyup.enter.native="getOrderList(params.content.pageNumber=1)"></el-input>
        <selectOrder v-if="dialogFormVisible" idName="sa_orderitemsid" ref="table" v-model="result" :layout="tablecols" :data="orderList" :custom="true" height="500px"  @upDateData="upDateData">
          <template v-slot:customcol="scope">
              <div>{{scope.column.data[scope.column.columnname]}}</div>
          </template>
        </selectOrder>
        <div class="container normal-panel" style="text-align:right">
          <el-pagination
              style="text-align:right"
              background
              small
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="params.content.pageNumber"
              :page-sizes="[20, 50, 100, 200]"
              layout="total,sizes, prev, pager, next, jumper"
              :total="total">
          </el-pagination>
        </div>
      </div>
      <div class="fixed__btn__panel">
        <el-button size="small" @click="dialogFormVisible = false" class="normal-btn-width">取 消</el-button>
        <el-button size="small" type="primary" @click="onSubmit" class="normal-btn-width">确 定</el-button>
      </div>
    </el-drawer>
  </div>
</template>

<script>
import selectOrder from './selectOrder'
export default {
  name: "add",
  props:['data','disabled'],
  components:{selectOrder},
  data(){
    return {
      result:[],
      dialogFormVisible:false,
      orderList:[],
      tablecols:[],
      total:0,
      params: {
        "id": 20221124091104,
        "content": {
          "pageNumber": 1,
          "pageSize": 20,
          "sys_enterpriseid":'',
          "sa_accountclassid":'',
          "sa_writeoffbillid":'',
          "where": {
              "condition": ""
          }
        }
      }
    }
  },
  created () {
    this.getOrderList()
    this.tablecols = this.tool.tabelCol(this.$route.name).addOrderTable.tablecols
  },
  watch: {
    dialogFormVisible (val) {
      if(!val) {
        this.$refs.table.allArr = []
      }
    }
  },
  methods:{
    addBtn () {
      this.dialogFormVisible = true
      this.getOrderList()
    },
    async onSubmit(){
      let result = this.$refs.table.allArr.map(item => {
        return {
          "sa_writeoffbill_orderid": 0,
          "sa_orderid":item.sa_orderid,
          "sa_orderitemsid":item.sa_orderitemsid,
          "writeoffamount":0,
          "remarks":""
        }
      })
      const res = await this.$api.requested({
        "id": "20221124090904",
        "version":1,
        "content": {
          sa_writeoffbillid:this.$route.query.id,
          writeoffbillOrder:result
        }
      })
      this.tool.showMessage(res,()=>{
        this.$emit('onSuccess')
        this.dialogFormVisible = false
      })
    },
    async getOrderList () {
      this.params.content.sys_enterpriseid = this.data.sys_enterpriseid
      this.params.content.sa_accountclassid = this.data.sa_accountclassid
      this.params.content.sa_writeoffbillid = this.$route.query.id
      let res = await this.$api.requested(this.params)
      this.orderList = res.data
      this.total = res.total
      console.log(res);
      
    },
    upDateData (data) {

    },
    handleSizeChange(val) {
      // console.log(`每页 ${val} 条`);
      this.params.content.pageSize = val
      this.getOrderList()
    },
    handleCurrentChange(val) {
      // console.log(`当前页: ${val}`);
      this.params.content.pageNumber = val
      this.getOrderList()
    },
  }
}
</script>

<style scoped>
.dialog-footer {
  margin-top: 0;
}
.el-select {
  width: 100%;
}
</style>