<template>
  <div>
    <div>
      <div class="flex-align-center" style="margin-bottom:10px">
        <el-input size="small" style="width:200px;margin-right:10px" v-model="params.content.where.condition" placeholder="输入搜索内容" @clear="listData(params.content.pageNumber = 1)" @keyup.native.enter="listData(params.content.pageNumber = 1)" clearable></el-input>
        <slot name="add"/>
      </div>
      <tableLayout :layout="tablecols" :data="list" :opwidth="200" :width="false" height="calc(100vh - 550px)" :custom="true" fixedName="operation" >
        <template v-slot:customcol="scope">
          <div v-if="scope.column.columnname == 'accountname'">
            <!-- <el-select v-if="currentEdit.sa_creditbilldetailid == scope.column.data.sa_creditbilldetailid && accountList.length > 0" size="small" v-model="scope.column.data.sa_accountclassid" placeholder="请选择账户类型">
              <el-option
                v-for="item in accountList"
                :key="item.sa_accountclassid"
                :label="item.accountname"
                :value="item.sa_accountclassid">
              </el-option>
            </el-select> -->
            <span>{{scope.column.data.accountname}}</span>
          </div>
          <div v-else-if="scope.column.columnname == 'creditquota'">
            <el-input size="mini" v-if="currentEdit.sa_creditbilldetailid == scope.column.data.sa_creditbilldetailid" v-model="scope.column.data.creditquota"></el-input>
            <p v-else>{{scope.column.data[scope.column.columnname]}}</p>
          </div>
          <div v-else-if="scope.column.columnname == 'remarks'">
            <el-input size="mini" v-if="currentEdit.sa_creditbilldetailid == scope.column.data.sa_creditbilldetailid" v-model.number="scope.column.data.remarks"></el-input>
            <p v-else>{{scope.column.data[scope.column.columnname]}}</p>
          </div>
          <p v-else>{{scope.column.data[scope.column.columnname]}}</p>
        </template>
        <template v-slot:opreation="scope">
          <el-button v-if="currentEdit.sa_creditbilldetailid == scope.data.sa_creditbilldetailid || scope.data.sa_creditbilldetailid == 0" type="text" size="mini" @click="save(scope.data)" class="inline-16">保 存</el-button>
          <slot name="edit" :data="scope.data" v-else></slot>
          <slot name="del" :data="scope.data"></slot>
        </template>
      </tableLayout>
    </div>
    <div style="margin-top:16px;text-align:right">
      <el-pagination
          background
          small
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="params.content.pageNumber"
          :page-size="params.content.pageSize"
          layout="total, prev, pager, next, jumper"
          :total="total">
      </el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  props:['disabled'],
  components: {},
  name: '',
  data() {
    return {
      list:[],
      params: {
        "id": 20230104100903,
        "content": {
          "sa_creditbillid":'',
          "pageNumber": 1,
          "pageSize": 20,
          "where": {
              "condition": ""
          }
        },
      },
      accountParam: {
        "id": "20221008164203",
        "version":1,
        "content": {
          "sys_enterpriseid":'',
          "sa_creditbillid":this.$route.query.id
        }
      },
      tablecols:[],
      total:0,
      currentEdit:{},
      accountList:[]
    };
  },
  computed:{
  },
  watch:{
  },
  created () {
    this.listData()
    this.tablecols = this.tool.tabelCol(this.$route.name).enterpriseInfoTable.tablecols
  },
  methods: {
    async listData(){
      this.params.content.sa_creditbillid = this.$route.query.id
      const res = await this.$api.requested(this.params)
      this.list = res.data
      this.total = res.total
      console.log(this.list);
      
    },
    // accountSelect (data) {
    //   console.log(data);
      
    //   data.sa_accountclassid = ''
    //   this.accountParam.content.sys_enterpriseid=data.sys_enterpriseid
    //   this.getAccountList(data)
    // },
    async getAccountList (data) {
      this.accountParam.content.sa_creditbillid = data.sa_creditbillid
      let res = await this.$api.requested(this.accountParam)
      this.accountList = res.data
      console.log(this.accountList);
      
    },
    handleChange(num) {
    },
    async save (data) {
      // if (!data.sa_accountclassid) return this.$message({
      //   type:'warning',
      //   message:'请选择账户类型'
      // })
      // console.log(typeof data.creditquota);
      
      if (typeof +data.creditquota != 'number') return this.$message({
        type:'warning',
        message:'信用额度是数字类型'
      })
      let res = await this.$api.requested({
        "id": 20230104100203,
        "content": {
          "sa_creditbillid": this.$route.query.id,
          "enterpriseinfos": [
            {
              "sa_creditbilldetailid":data.sa_creditbilldetailid,
                "sys_enterpriseid":data.sys_enterpriseid,
                "sa_accountclassid":data.sa_accountclassid,
                "creditquota":data.creditquota,
                "remarks":data.remarks
            },
          ]
        },
      })
      this.tool.showMessage(res,() => {
        this.currentEdit = ''
        this.$emit('onSuccess')
        this.listData()
      })
    },
    handleSizeChange(val) {
      // console.log(`每页 ${val} 条`);
      this.params.content.pageSize = val
    },
    handleCurrentChange(val) {
      // console.log(`当前页: ${val}`);
      this.params.content.pageNumber = val
    },
  },
};
</script>

<style scoped>

</style>
