<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="addProduct"/>
      </div>
      <tableLayout :layout="tablecols" :data="list" :opwidth="200" :width="false" height="calc(100vh - 550px)" :custom="true" fixedName="operation discountrate" >
        <template v-slot:customcol="scope">
          <div v-if="scope.column.columnname == 'discountrate'">
            <el-input size="mini" v-if="currentEdit.sa_contract_itemsaleclassid == scope.column.data.sa_contract_itemsaleclassid" v-model="scope.column.data.discountrate" @input="discountrateChange($event,scope.column.data)"></el-input>
            <p v-else>{{scope.column.data[scope.column.columnname] }}</p>
          </div>
          <div v-else-if="scope.column.columnname == 'brand'">
            {{scope.column.data[scope.column.columnname][0] && scope.column.data[scope.column.columnname][0].brandname}}
          </div>
          <p v-else>{{scope.column.data[scope.column.columnname]}}</p>
        </template>
        <template v-slot:opreation="scope">
          <el-button v-if="currentEdit.sa_contract_itemsaleclassid == scope.data.sa_contract_itemsaleclassid" 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>
          <!-- <edit :data="scope.data"></edit> -->
        </template>
      </tableLayout>
    </div>
    <div style="margin-top:16px;text-align:right">
      <el-pagination
          background
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="params.content.pageNumber"
          :page-sizes="[20, 50, 100, 200]"
          :page-size="100"
          layout="total,sizes, prev, pager, next, jumper"
          :total="total">
      </el-pagination>
    </div>
  </div>
</template>

<script>
// import edit from './editProduct'
import addProduct from './addProduct'
import previewImage from '@/components/previewImage/index'
export default {
  components: {addProduct,previewImage},
  name: '',
  data() {
    return {
      list:[],
      params: {
          "id": 20221124135602,
          "content": {
              "sa_contractid": '',
              "pageNumber": 1,
              "pageSize": 100,
              "where": {
                  "condition": "",
              }
          },
      },
      form: {
        discountrate:'',
      },
      tablecols:[],
      total:0,
      currentEdit:'',
      itemclassid:''
    };
  },
  computed:{
  },
  watch:{
  },
  created () {
    if (this.$route.query.id) this.listData()
    this.tablecols = this.tool.tabelCol(this.$route.name).productClassTable.tablecols
  },
  methods: {
    async listData(){
      this.params.content.sa_contractid = this.$route.query.id
      const res = await this.$api.requested(this.params)
      res.data = res.data.map(e=>{
        e.discountrate = Math.round((e.discountrate * 100) * 100)/100
        return e
      })
      this.list = res.data
      this.total = res.total
      this.$emit('priceChange')
    },
    qtyChange (num) {
      this.form.qty = num
      console.log(num);
    },
    handleChange(num) {
      console.log(num);
      
    },
    discountrateChange (num,data) {
      this.form.discountrate = Math.round(num * 100)/100
      this.form.price = this.form.discountrate * data.marketprice
    },
    priceChange (num,data) {
      this.form.price = num
      this.form.discountrate = Math.round((this.form.price / data.marketprice)*100 )/100
      console.log(this.form.price,data.marketprice);
      
    },
    async save (data) {
      if (data.discountrate > 100){
        data.discountrate = 100
      }else if (data.discountrate < 0){
        data.discountrate = 1
      }
      data.discountrate = Math.round(data.discountrate *100)/100
      let res = await this.$api.requested({
        "id":20221124110202,
        "content": {
         "sa_contractid": data.sa_contractid,
          "items": [
              {
                  "sa_contract_itemsaleclassid": data.sa_contract_itemsaleclassid,
                  "itemclassid": data.itemclassid,
                  "discountrate": (data.discountrate / 100).toFixed(4)
              }
          ]
        }
      })
      this.tool.showMessage(res,() => {
        this.currentEdit = ''
        this.listData()
        this.$emit('editSuccess',res.data.signamount)
      })
    },
    handleSizeChange(val) {
      // console.log(`每页 ${val} 条`);
      this.params.content.pageSize = val
      this.listData()
    },
    handleCurrentChange(val) {
      // console.log(`当前页: ${val}`);
      this.params.content.pageNumber = val
      this.listData()
    },
  },
};
</script>

<style scoped>

</style>
