<template>
  <div class="app-container">
    <formComponent
      :formOption="formOption"
      :dataList="dataList"
      :inDex="inDex"
      ref="avatar"
      @submitForm="submitForm"
      @returnToForm="returnToForm"
    />
    <listComponent
      :tableData="tableData"
      @modify="modification"
      @deletion="deletion"
      @buttonList="buttonList"
      @showSearch="showSearch"
      @feedback="feedback"
      @getList="getList"
      :hasPermi="hasPermi"
      :isItHidden="isItHidden"
      :customButton="customButton"
      :listStyle="listStyle"
      :queryList="queryList"
      :setRowList="setRowList"
      :tatolLabel="tatolLabel"
    />
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="formDataList.pageNum"
      :limit.sync="formDataList.pageSize"
      @pagination="getList"
    />
    <!--    <el-pagination-->
    <!--      style="float: right;margin-top: 10px"-->
    <!--      @size-change="handleSizeChange"-->
    <!--      @current-change="handleCurrentChange"-->
    <!--      :page-sizes="[10, 20, 30, 50]"-->
    <!--      :page-size="this.formDataList.pageSize"-->
    <!--      background-->
    <!--      layout="sizes, prev, pager, next"-->
    <!--      :total="total">-->
    <!--    </el-pagination>-->
  </div>
</template>

<script>
import {queryData, listExport, getustomer, getGoodName,getwarehouse } from '@/api/reportAnalysis/inventoryAccount'
import Cookies from 'js-cookie'
import { select } from '@/api/system/set'

export default {
  name: 'inventoryAccount',
  data(){
    return{
      tatolLabel:['起初数量','期初金额'],
      dataList:{
        fCorpid:[],
        feeName:[],
        fFeeType:[],
        fWarehouseid:[]
      },
      tableData:[],
      setRowList:[],
      isItHidden: true,
      queryList: {
        tableName: '库存总账',
        columnList: []
      },
      hasPermi:{
        lookup:['anpin:stockControl:query'],
        disappear:['anpin:stockControl:remove']
      },
      customButton: [
        {
          type: 'primary',
          size: 'mini',
          icon: 'el-icon-edit',
          name: '导出',
          disabled: false,
          hasPermi:['anpin:stockControl:selectInventoryLedgerExcePorrt']
        }],
      inDex: 4,
      total:0,
      formDataList:{
        pageSize:10,
        pageNum:1,
      },
      listStyle: [
        {
          surface: '1',
          label: 'serialNumber',
          name: '序号',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '2',
          label: 'fyears',
          name: '年',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '3',
          label: 'fmonth',
          name: '月',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '4',
          label: 'fCorpName',
          name: '供应商',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '5',
          label: 'fFName',
          name: '货物',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '6',
          label: 'fCurrency',
          name: '包装单位',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '7',
          label: 'feeUnitName',
          name: '计量单位',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '8',
          label: 'fWarehouseName',
          name: '库区',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '9',
          label: 'fBeginQty',
          name: '期初数量',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '10',
          label: 'fBeginUnitprice',
          name: '期初单价',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '11',
          label: 'fBeginAmount',
          name: '期初金额',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '12',
          label: ' rQty',
          name: '入库数量',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '13',
          label: 'rfAmount',
          name: '入库金额',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '14',
          label: ' cQty',
          name: '出库数量',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '15',
          label: 'cfAmount',
          name: '出库金额',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '16',
          label: 'fAfterQty',
          name: '结余数量',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '17',
          label: ' fAfterUnitprice',
          name: '结余单价',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '18',
          label: 'fAfterAmount',
          name: '结余金额',
          checked: 0,
          width: 100,
          onabort: ''
        }
      ],
      formOption:[
        {
          span: 6,
          label: 'fCorpid',
          name: '供应商',
          inputType: 1,
          width: 200,
          labelSize: '80',
          rules: [{ required: false, message: ' ' }]
        },{
          span: 6,
          label: 'fFeeType',
          name: '货物类别',
          inputType: 1,
          width: 200,
          labelSize: '80',
          rules: [{ required: false, message: ' ' }]
        },{
          span: 6,
          label: 'timeInterval',
          name: '期间',
          inputType: 3,
          width: 240,
          labelSize: '80',
          rules: [{ required: false, message: ' ' }]
        },
        {
          span: 6,
          label: 'fWarehouseid',
          name: '仓库',
          inputType: 1,
          width: 200,
          labelSize: '80',
          rules: [{ required: false, message: ' ' }]
        },
        {
          span: 6,
          label: 'feeName',
          name: '货物名称',
          inputType: 1,
          width: 200,
          labelSize: '80',
          rules: [{ required: false, message: ' ' }]
        },
      ]
    }
  },
  created() {
    this.queryList.columnList = this.listStyle
    this.setRowList = this.listStyle
    let queryParams = { pageNum: 1, fTypeid: 1}
    getustomer(queryParams).then(res => {
      for (let item in res.data) {
        this.dataList.fCorpid.push({
          label: res.data[item].fName,
          value: res.data[item].fId,
        })
      }
    })
    //获取品名
    getGoodName().then(res=>{
      for(let item in res.rows){
        this.dataList.feeName.push({
          label:res.rows[item].fName,
          value:res.rows[item].fId,
        })
      }
    })
    this.getDicts("data_cost_attribute").then((response) => {
      for(let item in response.data){
        this.dataList.fFeeType.push({
          value: response.data[item].dictValue,
          label:response.data[item].dictLabel
        })
      }
    });
    getwarehouse().then(res=>{
      for(let item in res.rows){
        this.dataList.fWarehouseid.push({
          label:res.rows[item].fName,
          value:res.rows[item].fId,
        })
      }
    })
    this.getList()
    let data = {
      tableName: this.queryList.tableName,
      userId: Cookies.get('userName')
    }
    this.getRow(data)
  },
  methods:{
    getRow(data,list) {
      select(data).then((res) => {
        if (res.data.length != 0) {
          this.queryList.columnList = res.data.filter((e) => e.checked == 0)
          this.queryList.columnList = res.data
          this.setRowList = res.data
          this.queryList.columnList = this.queryList.columnList.filter((e) => e.checked == 0)
          // this.waitFor = true
        } else {
          this.$set(this.queryList, 'columnList', this.$options.data().listStyle)
          this.setRowList = this.$options.data().listStyle
        }
        this.isItHidden = true
        // this.inDex = this.formOption.length
        this.inDex = 4
      })
    },
    //修改
    modification(scope) {
      console.log(scope)
    },
    //删除
    deletion(scope){},
    //所以按钮
    buttonList(row){
      console.log(row)
      switch (row.name){
        case '导出':
          const queryParams = this.formDataList;
          this.$confirm("是否确认导出所有销售出库数据项?", "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          })
            .then(function () {
              return listExport(queryParams);
            })
            .then((response) => {
              this.download(response.msg);
            });
          break
      }
    },
    // 显示搜索条件、点击后会调用此方法
    showSearch() {
      console.log('到我了')
      this.searchWhether = !this.searchWhether
    },
    //搜索、重置、展开
    feedback(res) {
      console.log(res)
      if (res == '展开') {
        if (this.inDex == 4) {
          this.inDex = this.formOption.length
        } else {
          this.inDex = 4
        }
      } else if (res == '搜索') {
        this.$refs.avatar.submitForm()
      } else if (res == '重置') {
        this.$refs.avatar.form = {}
        this.$refs.avatar.submitForm()
      }
    },
    //点击刷新会调用此方法
    getList() {
      console.log('到我了2')
      queryData(this.formDataList).then(res=>{
        this.tableData = res.rows
        this.total = res.total
      })
    },
    submitForm() {
      console.log(this.$refs.avatar.form)
      this.formDataList = this.$refs.avatar.form
      this.getList()
    },
    returnToForm(row) {
      console.log(row, 111)
    },
    //分页
    handleSizeChange(val) {
      // console.log(`每页 ${val} 条`);
      this.formDataList.pageSize = val
      this.query(this.formDataList)
    },
    handleCurrentChange(val) {
      // console.log(`当前页: ${val}`);
      this.formDataList.pageNum = val
      this.query(this.formDataList)
    },
  }
}
</script>

<style scoped>

</style>
