tire-platform-ui/src/views/workManagement/receipt/statisticalList.vue

<template>
  <basic-container>
    <avue-crud :option="option"
               :data="dataList"
               :table-loading="loading"
               ref="crud"
               v-model="form"
               :page.sync="page"
               :search.sync="search"
               @search-change="searchChange"
               @search-reset="searchReset"
               @selection-change="selectionChange"
               @current-change="currentChange"
               @size-change="sizeChange"
               @refresh-change="refreshChange"
               @on-load="onLoad"
               @saveColumn="saveColumn"
               @resetColumn="resetColumn"
    >
      <template slot="menuLeft">
        <el-button
          icon="el-icon-printer"
          size="small"
          type="primary"
          :loading="exportLoading"
          @click.stop="downFile"
        >导 出
        </el-button>
        <el-button
          icon="el-icon-printer"
          size="small"
          type="primary"
          :loading="exportLoading"
          @click.stop="statement"
        >报表
        </el-button>
      </template>
      <template slot="cornIdSearch">
        <select-component
          v-model="search.cornId"
          :configuration="configuration"
        ></select-component>
      </template>
      <template slot-scope="scope" slot="cornId">
        <span style="color: #409EFF;cursor: pointer" @click.stop="check(scope.row,scope.index)">{{ scope.row.cornName }}</span>
      </template>
      <template slot-scope="scope" slot="deptid">
        {{ scope.row.deptName }}
      </template>
      <template slot="userNameSearch">
        <el-select v-model="search.userName"
                   remote
                   filterable
                   clearable
                   :remote-method="remoteMethod"
                  >
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.realName"
            :value="item.realName">
          </el-option>
        </el-select>
      </template>
      <template slot-scope="scope" slot="menu">
        <el-button
          type="text"
          size="small"
          @click.stop="check(scope.row, scope.index)"
        >查 看
        </el-button>
      </template>
    </avue-crud>
    <report-dialog
      :switchDialog="switchDialog"
      :searchValue="statementData"
      :reportName="'同海-统计列表'"
      @onClose="onClose()"
    ></report-dialog>
  </basic-container>
</template>

<script>
  import option from "./configuration/statisticalList.json";
  import reportDialog from "@/components/report-dialog/main";
  import { getFlowList,getUserList ,statisticalAnalysis} from "@/api/workManagement/mainProject";

  export default {
    name: "statisticalList",
    components:{
      reportDialog
    },
    data() {
      return {
        loading:false,
        form: {},
        search:{},
        statementData:{},
        exportLoading:false,
        option: option,
        parentId:0,
        dataList: [],
        options:[],
        switchDialog:false,
        page: {
          currentPage: 1,
          total: 0,
          pageSize: 10
        },
        configuration:{
          multipleChoices:false,
          multiple:false,
          disabled:false,
          searchShow:true,
          collapseTags:false,
          clearable:true,
          placeholder:'请点击右边按钮选择',
          dicData:[]
        },
        query:{}
      }
    },
    async created() {

      // this.option = await this.getColumnData(this.getColumnName(57), option);

      getUserList().then(res=>{
        res.data.data.map((item,index)=>{
          if(index <= 20){
            this.options.push(item)
          }
        })
      })
    },
    mounted() {
      // option.height = window.innerHeight - 320 ;
    },
    methods: {

      onClose(val) {
        this.switchDialog = val;
      },

      downFile(){
        this.exportLoading = true
        let  searchParams = Object.assign({},this.search);
        let param = this.paramsAdjustment(searchParams)
        if(param.status === "0,1,2,3,4,5,6,7,8"){
          param.status = ""
        }
        statisticalAnalysis(param).then(res=>{
          const fileData = this.deepClone(res.data.data)
          fileData.map(item =>{
            item.cornId = item.cornName
            item.deptid = item.deptName
            item.status = item.strStatus
            if(item.projectType == 0){
              item.projectType = "正常"
            }else if(item.projectType == 1){
              item.projectType = "追加"
            }else if(item.projectType == 2){
              item.projectType = "退款"
            }
          })
          this.$Export.excel({
            title: "统计列表",
            columns: option.column,
            data: fileData,
          });
          }).finally(()=>{
            this.exportLoading = false
        })
      },
      statement(){
        this.statementData = this.paramsAdjustment(this.search)
        if(this.statementData.status === "0,1,2,3,4,5,6,7,8"){
          this.statementData.status = ""
        }
        if(this.statementData.payTime && this.statementData.payTime.length === 0){
          this.statementData.payStartTime = ""
          this.statementData.payEndTime = ""
        }
        this.statementData.tenantId = this.$store.getters.userInfo.tenant_id
        this.switchDialog =! this.switchDialog;
      },
      rowDel() {

      },
      //修改时的修改按钮点击触发
      rowUpdate() {

      },
      //新增修改时保存触发
      rowSave() {

      },
      remoteMethod(query){
        let params = {
          realName : query
        }
        getUserList(params).then(res=>{
          this.options = res.data.data
        })
      },
      check(row,index){
        if(this.$store.getters.mainItemStatus){
          this.$alert("主营业务页面已存在,请关闭页面再进行操作", "温馨提示", {
            confirmButtonText: "确定",
            type: 'warning',
            callback: action => {
            }
          });
        }else{
          //关闭一下存在的列表页
          this.$router.$avueRouter.closeTag('/workManagement/main-items/list');
          this.$router.push({
            path: "/workManagement/main-items/list",
            query: {itemId: row.pid},
          });
        }
      },
      //点击搜索按钮触发
      searchChange(params, done) {
        this.onLoad(this.page, params);
        done()
      },
      searchReset() {
        console.log('1')
      },
      selectionChange() {
        console.log('1')
      },
      currentChange(val) {
        this.page.currentPage = val;
        // this.onLoad(this.page,this.search)
      },
      sizeChange() {
        console.log('1')
      },
      refreshChange() {
        this.onLoad(this.page)
      },
      paramsAdjustment(params){
        params = Object.assign({},this.search);
        if (params.payTime &&  params.payTime.length !=0) { //结算
          params.payStartTime = params.payTime[0]+ " " + "00:00:00";
          params.payEndTime = params.payTime[1] + " " + "23:59:59";
          this.$delete(params,'payTime')
        }
        if(!params.status && params.status!==0){
          params.status = "0,1,2,3,4,5,6,7,8";
        }
        return params
      },
      onLoad(page, params) {
       let param = this.paramsAdjustment(params)
        this.loading = true
        getFlowList(page.currentPage, page.pageSize,param).then(res =>{
          this.dataList = res.data.data.records
          this.page.total = res.data.data.total
        }).finally(()=>{
          this.loading = false
        })
      },
      //列保存触发
      async saveColumn() {
        const inSave = await this.saveColumnData(
          this.getColumnName(57),
          this.option
        );
        if (inSave) {
          this.$message.success("保存成功");
          //关闭窗口
          this.$refs.crud.$refs.dialogColumn.columnBox = false;
        }
      },
      async resetColumn() {
        const inSave = await this.delColumnData(
          this.getColumnName(57),
          option
        );
        if (inSave) {
          this.$message.success("重置成功");
          this.option = option;
          //关闭窗口
          this.$refs.crud.$refs.dialogColumn.columnBox = false;
        }
      },
    },
  }
</script>

<style scoped>

</style>