tire-platform-ui/src/views/statisticAnalysis/royalty/index.vue

<template>
  <basic-container>
    <avue-crud :option="option"
               :data="dataList"
               ref="crud"
               v-model="form"
               :page.sync="page"
               :search.sync="search"
               :table-loading="loading"
               :span-method="spanMethod"
               :cell-style="cellStyle"
               @search-change="searchChange"
               @search-reset="searchReset"
               @selection-change="selectionChange"
               @current-change="currentChange"
               @size-change="sizeChange"
               @refresh-change="refreshChange"
               @saveColumn="saveColumn"
               @resetColumn="resetColumn"
               @on-load="onLoad">
      <template slot="yearSearch">
        <el-date-picker
          v-model="search.year"
          type="year"
          placeholder="">
        </el-date-picker>
      </template>
      <template slot="userIdSearch">
        <user-com
          v-model="search.userId"
          style="width: 100%"
        ></user-com>
      </template>
      <template slot="goodsNameSearch">
        <goods-select
          v-model="search.goodsName"
          @valueName="(value) => valueName(value)"
          :configuration="configuration"
        >
        </goods-select>
      </template>
      <template slot="menuLeft">
        <el-button size="small"
                   type="primary"
                   @click.stop="statement"
        >报表打印
        </el-button>
      </template>
    </avue-crud>
    <report-dialog
      :switchDialog="switchDialog"
      :searchValue="statementData"
      :reportName="'进口贸易-提成统计表'"
      @onClose="onClose()"
    ></report-dialog>
  </basic-container>
</template>

<script>
  import option from "./config/mainList.json";
  import { getCommission } from "@/api/statisticAnalysis/profit";
  import { contrastList } from "@/util/contrastData";
  import reportDialog from "@/components/report-dialog/main";

  export default {
    data() {
      return {
        loading : false,
        form: {},
        search:{},
        show:true,
        detailData:{},
        option: option,
        spanArr:[],
        position:0,
        parentId:0,
        dataList: [],
        statementData:[],
        switchDialog:false,
        page: {
          pageSize: 10,
          pagerCount: 5,
          total: 0,
        },
        query:{},
        configuration:{
          multipleChoices:false,
          multiple:false,
          disabled:false,
          searchShow:true,
          collapseTags:false,
          clearable:true,
          placeholder:'请点击右边按钮选择',
          dicData:[]
        },
      }
    },
    components:{
      reportDialog
    },
    async created() {
      // this.option = await this.getColumnData(this.getColumnName(66), option);
    },
    mounted() {

    },
    methods: {
      valueName(value){
        this.search.goodsId  = value.id
      },
      addReceipt(){
        console.log('1')
      },
      editOpen(){
        console.log('1')
      },
      // rowspan() {
      //   //记录原始
      //   let oldList = [this.dataList[0].userName]
      //   this.dataList.forEach((item,index)=>{
      //     let newList = [item.userName]
      //     if(index===0){
      //       this.spanArr.push(1)
      //       this.position=0;
      //     }else{
      //       //如果循环数据与原始数据相等  那么合并
      //       if(!contrastList(oldList,newList)){
      //         this.spanArr[this.position] +=1;
      //         this.spanArr.push(0)
      //       }else{
      //         //如果不等 更新原始数据  循环在比较
      //         oldList = newList
      //         this.spanArr.push(1)
      //         this.position = index
      //       }
      //     }
      //   })
      // },
      // spanMethod({ row, column, rowIndex, columnIndex }) {
      //   if (column.property === "userName") {
      //     const _row=this.spanArr[rowIndex];
      //     const _col=_row>0?1:0;
      //     return {
      //       rowspan:_row,
      //       colspan:_col
      //     }
      //   }
      // },
      //点击搜索按钮触发
      searchChange(params, done) {
        this.query = params;
        this.page.currentPage = 1;
        this.onLoad(this.page, params);
        done()
      },
      searchReset() {
        console.log('1')
      },
      selectionChange() {
        console.log('1')
      },
      currentChange(val) {
        this.page.currentPage = val
      },
      sizeChange() {
        console.log('1')
      },
      refreshChange() {
        this.onLoad(this.page);
      },
      statement(){
        this.statementData = this.paramsAdjustment(this.search)
        this.switchDialog =! this.switchDialog;
      },
      onClose(val) {
        this.switchDialog = val;
      },
      paramsAdjustment(params) {
        params = Object.assign({}, this.search);

        if(params.year && params.year !== '2022'){
          params.year = params.year.getFullYear()
        }
        return params
      },
      onLoad(page, params) {
        params = this.paramsAdjustment(params)
        if(!params.goodsId){
          this.$message.warning("请先选择商品!")
          return
        }
        if(!params.userType){
          this.$message.warning("请先选择提成类型!")
          return
        }
        if(!params.quarter){
          this.$message.warning("请先选择季度!")
          return
        }
        if(!params.year){
          this.$message.warning("请先选择年份!")
          return
        }
        this.loading = true;
        getCommission(page.currentPage, page.pageSize,params).then(res=>{
          this.dataList = res.data.data
          if (res.data.data) {
            this.option.height = window.innerHeight - 240;
          }
          // this.rowspan()
        }).finally(()=>{
          this.loading = false;
        })
      },
      cellStyle() {
        return "padding:0;height:40px;";
      },
      //列保存触发
      async saveColumn() {
        const inSave = await this.saveColumnData(
          this.getColumnName(66),
          this.option
        );
        if (inSave) {
          this.$message.success("保存成功");
          //关闭窗口
          this.$refs.crud.$refs.dialogColumn.columnBox = false;
        }
      },
      async resetColumn() {
        const inSave = await this.delColumnData(
          this.getColumnName(66),
          option
        );
        if (inSave) {
          this.$message.success("重置成功");
          this.option = option;
          //关闭窗口
          this.$refs.crud.$refs.dialogColumn.columnBox = false;
        }
      },
    }
  }
</script>

<style scoped>

</style>