tire-platform-ui/src/views/financialManagement/receiptSettle/receiptSettle.vue

<template>
  <basic-container v-if="show">
    <avue-crud :option="option"
               :data="dataList"
               ref="crud"
               v-model="form"
               :page.sync="page"
               :search.sync="search"
               :table-loading="loading"
               @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="corpIdSearch">
        <select-component
          v-model="search.corpId"
          :configuration="configuration"
        ></select-component>
      </template>
      <template slot="menuLeft">
        <el-button type="primary"
                   size="small"
                   icon="el-icon-plus"
                   @click="addReceipt">创建单据
        </el-button>
        <el-button size="small"
                   type="info"
                   @click.stop="openReport()"
        >导出报表
        </el-button>
      </template>
      <template slot-scope="scope" slot="menu">
        <el-button
          type="text"
          size="small"
          icon="el-icon-edit"
          @click.stop="editOpen(scope.row, 2)"
        >编辑
        </el-button>
        <el-button
          type="text"
          size="small"
          icon="el-icon-delete"
          @click.stop="rowDel(scope.row, scope.index)"
        >删除
        </el-button>
      </template>
    </avue-crud>
  </basic-container>
  <detail-page
    ref="detail"
    @goBack="goBack"
    :detailData="detailData"
    v-else
  ></detail-page>
</template>

<script>
  import option from "./configuration/mainList.json";
  import {getList ,remove} from "@/api/financialManagement/financialManagement"
  import detailPage from "./receiptSettleDetailsPage.vue";

  export default {
    data() {
      return {
        loading : false,
        form: {},
        search:{},
        option: {},
        parentId:0,
        show:true,
        detailData:{},
        dataList: [{
          canem:""
        }],
        page: {
          pageSize: 10,
          pagerCount: 5,
          total: 0,
        },
        query:{},
        configuration:{
          multipleChoices:false,
          multiple:false,
          disabled:false,
          searchShow:true,
          collapseTags:false,
          clearable:true,
          placeholder:'请点击右边按钮选择',
          dicData:[]
        },
      }
    },
    components:{
      detailPage
    },
    async created() {
      this.option = await this.getColumnData(this.getColumnName(64), option);
    },
    mounted() {
      // this.option.height = window.innerHeight - 200;
    },
    methods: {
      //新单打开
      addReceipt(row){
        this.detailData = {
          id: row.id,
          status: 1
        };
        this.show = false;
      },
      //编辑打开
      editOpen(row,status){
        const data = {
          moduleName: 'sf',
          tableName: 'finance_settlement',
          billId: row.id,
          no: localStorage.getItem('browserID')
        }
        this.inDetailsKey(this.$route.name, {
          moduleName: 'sf',
          tableName: 'finance_settlement',
          billId: row.id,
        })
        this.checkLock(data).then(res => {
          if (res.data.code == 200) {
            this.detailData = {
              disabled: true,
              id: row.id,
              status: status
            };
            this.show = false;
          }
        }).catch(error => {
          this.detailData = {
            disabled: true,
            id: row.id,
            status: status
          };
          this.show = false;
        })
      },
      rowDel(row, index, done) {
        if(row.id){
          this.$confirm("确定将选择数据删除?", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(() => {
            remove(row.id).then(res =>{
              if(res.data.success){
                this.$message.success("操作成功!");
                this.onLoad(this.page);
              }
            })
          });
        }
      },
      //点击搜索按钮触发
      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(params) {
        this.onLoad(this.page,params)
      },
      paramsAdjustment(params) {
        params = Object.assign({}, this.search);
        if (params.settlementDate &&  params.settlementDate.length !==0 ) {  //合同
          params.settlementStartDate = params.settlementDate[0]+ " " + "00:00:00";
          params.settlementEndDate = params.settlementDate[1] + " " + "23:59:59";
          this.$delete(params,'settlementDate')
        }
        return params
      },
      onLoad(page, params) {
        this.loading = true
        params = this.paramsAdjustment(params)
        params.billType = "收费"
        params.settlementType = 1

        getList(page.currentPage, page.pageSize,params).then(res =>{
          this.dataList = res.data.data.records
          this.page.total = res.data.data.total
        }).finally(()=>{
          this.loading = false
        })
      },
      goBack() {
        this.detailData=this.$options.data().detailData
        this.show = true;
        this.onLoad(this.page,this.search)
      },
      //列保存触发
      async saveColumn() {
        const inSave = await this.saveColumnData(
          this.getColumnName(64),
          this.option
        );
        if (inSave) {
          this.$message.success("保存成功");
          //关闭窗口
          this.$refs.crud.$refs.dialogColumn.columnBox = false;
        }
      },
      async resetColumn() {
        const inSave = await this.delColumnData(
          this.getColumnName(64),
          option
        );
        if (inSave) {
          this.$message.success("重置成功");
          this.option = option;
          //关闭窗口
          this.$refs.crud.$refs.dialogColumn.columnBox = false;
        }
      },
    }
  }
</script>

<style scoped>

</style>