anpinjingyuan-ui/src/views/reportAnalysis/inoutStatistics.vue

<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"
      :tatolLabel="tatolLabel"
      :isItHidden="isItHidden"
      :customButton="customButton"
      :listStyle="listStyle"
      :queryList="queryList"
      :setRowList="setRowList"
    />
<!--    <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 style="float: right">
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="formDataList.pageNum"
      :limit.sync="formDataList.pageSize"
      :page-sizes="[10,100,200,500,1000]"
      @pagination="getList"
    />
    </div>
  </div>
</template>

<script>
import { select } from '@/api/system/set'
import{ queryData, company, productName, listExport} from '@/api/reportAnalysis/inoutStatistics'
import Cookies from 'js-cookie'

export default {
  name: 'salesStatistics',
  data(){
    return{
      tatolLabel:['数量'],
      dataList:{
        fBilltype:[{ label: '出库',value:'CK'},{ label: '入库',value:'RK'}],
        fFeeType:[],
        fFeeid:[],
        fCorpid:[],
        fBillstatus:[{label:'全部',value:''},{label:'入账',value:'1'},{label:'未入账',value:'2'},]
      },
      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:tWarehouseInorOutExcePorrt']
        }
        ],
      inDex: 4,
      total:0,
      formDataList:{
        pageSize:10,
        pageNum:1,
      },
      listStyle: [
        {
          surface: '1',
          label: 'serialNumber',
          name: '序号',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '2',
          label: 'fBilltypeName',
          name: '出入库类别',
          checked: 0,
          width: 100,
          onabort: ''
        },
        {
          surface: '3',
          label: 'fBsdate',
          name: '进货时间',
          checked: 0,
          width: 100,
          onabort: ''
        },
        {
          surface: '4',
          label: 'fFeetype',
          name: '货物类别',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '5',
          label: 'feeName',
          name: '产品名称',
          checked: 0,
          width: 100,
          onabort: ''
        },
        {
          surface: '6',
          label: 'fCurrencyName',
          name: '规格',
          checked: 0,
          width: 100,
          onabort: ''
        },
        {
          surface: '7',
          label: 'fQty',
          name: '数量',
          checked: 0,
          width: 100,
          onabort: ''
        },
        {
          surface: '8',
          label: 'corpName',
          name: '供货商',
          checked: 0,
          width: 100,
          onabort: ''
        },
        {
          surface: '9',
          label: 'fManage',
          name: '供货人',
          checked: 0,
          width: 100,
          onabort: ''
        },
        {
          surface: '10',
          label: 'fTel',
          name: '联系电话',
          checked: 0,
          width: 100,
          onabort: ''
        },
        {
          surface: '11',
          label: 'tProductdate',
          name: '生产日期',
          checked: 0,
          width: 100,
          onabort: ''
        },{
          surface: '12',
          label: 'fLotno',
          name: '批号',
          checked: 0,
          width: 100,
          onabort: ''
        },
        {
          surface: '13',
          label: 'quality',
          name: '保质期限',
          checked: 0,
          width: 100,
          onabort: ''
        },
        {
          surface: '14',
          label: 'fStoreEnvName',
          name: '保存条件',
          checked: 0,
          width: 100,
          onabort: ''
        },
        {
          surface: '15',
          label: 'fIsfillesName',
          name: '索证索票',
          checked: 0,
          width: 100,
          onabort: ''
        },
        {
          surface: '16',
          label: 'purchaseName',
          name: '采购人',
          checked: 0,
          width: 100,
          onabort: ''
        },
        {
          surface: '17',
          label: 'checkoutName',
          name: '感官',
          checked: 0,
          width: 100,
          onabort: ''
        },
        {
          surface: '18',
          label: 'checkoutName',
          name: '数量',
          checked: 0,
          width: 100,
          onabort: ''
        },
        {
          surface: '19',
          label: 'checkName',
          name: '验收人',
          checked: 0,
          width: 100,
          onabort: ''
        }
        ],
      formOption:[
        {
          span: 6,
          label: 'fBilltype',
          name: '统计类型',
          inputType: 1,
          width: 200,
          labelSize: '80',
          rules: [{ required: false, message: ' ' }]
        },
        {
          span: 6,
          label: 'fCorpid',
          name: '供应商',
          inputType: 1,
          width: 200,
          labelSize: '80',
          rules: [{ required: false, message: ' ' }]
        },
        {
          span: 6,
          label: 'cLoadDate',
          name: '统计期间',
          inputType: 3,
          width: 240,
          labelSize: '82',
          rules: [{ required: false, message: ' ' }]
        },
        {
          span: 6,
          label: 'fFeeType',
          name: '物资类别',
          inputType: 1,
          width: 200,
          labelSize: '80',
          rules: [{ required: false, message: ' ' }]
        },
        {
          span: 6,
          label: 'fFeeid',
          name: '产品名称',
          inputType: 1,
          width: 200,
          labelSize: '80',
          rules: [{ required: false, message: ' ' }]
        },
        {
          span: 6,
          label: 'fBillstatus',
          name: '状态',
          inputType: 1,
          width: 200,
          labelSize: '80',
          rules: [{ required: false, message: ' ' }]
        },
      ]
    }
  },
  created() {
    this.queryList.columnList = this.listStyle
    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
        })
      }
    });
    company(1).then(res => {
      for (let item in res.data) {
        this.dataList.fCorpid.push({
          label: res.data[item].fName,
          value: res.data[item].fId
        })
      }
      console.log(this.dataList)
    })
    productName().then(res => {
      console.log(res)
      if (res.code === 200) {
        for (let item in res.rows) {
          this.dataList.fFeeid.push({
            label: res.rows[item].fName,
            value: res.rows[item].fId,
          })
        }
      }
    })
    let data = {
      tableName: this.queryList.tableName,
      userId: Cookies.get('userName')
    }
    this.getRow(data)
    this.getList()
  },
  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')
      // this.feedback('重置')
      this.query(this.formDataList)
    },
    //查询主页列数据
    query(data) {
      queryData(data).then(res => {
        this.tableData = res.rows
        this.total = res.total
        console.log(this.total)
      })
    },
    submitForm() {
      this.formDataList = this.$refs.avatar.form
      this.query(this.formDataList)
    },
    returnToForm(row) {
      console.log(row, 111)
    },
    //分页
    handleSizeChange(val) {
      this.formDataList.pageSize = val
      this.query(this.formDataList)
    },
    handleCurrentChange(val) {
      this.formDataList.pageNum = val
      this.query(this.formDataList)
    },
  }
}
</script>
<style scoped lang="scss">
.app-container ::v-deep .el-form-item {
  margin-bottom: 4px;
}
</style>