Smart_platform_ui/src/components/bill/selectOrderDetailList.vue

<template>
  <div>
    <avue-crud :option="option" :table-loading="loading" :data="data" :search.sync="search" ref="crud"
      @refresh-change="refreshChange" @selection-change="selectionChange" @search-change="searchChange"
      @saveColumn="saveColumn" :page.sync="page" @on-load="onLoad">
      <template slot="costTypeSearch">
        <breakdown-select v-model="search.costType" :configuration="breakConfiguration"></breakdown-select>
      </template>
      <template slot="menuLeft">
        <el-tabs v-model="activeName" @tab-click="tabHandle">
          <el-tab-pane label="查询结果" name="searchList"></el-tab-pane>
          <el-tab-pane label="已选定数据" name="importStaging"></el-tab-pane>
        </el-tabs>
      </template>
      <template slot-scope="scope" slot="menu">
        <el-button type="text" icon="el-icon-edit" size="small" @click.stop="importStagList(scope.row, scope.index)"
          v-if="activeName == 'searchList'"
          :disabled="goodsListSave.findIndex(item => item.id == scope.row.id) !== -1">选择
        </el-button>
        <el-button type="text" icon="el-icon-delete" size="small" @click.stop="removeStagList(scope.row, scope.index)"
          v-else>移除
        </el-button>
      </template>
    </avue-crud>
    <div class="dialogButton">
      <span slot="footer" class="dialog-footer">
        <el-button @click="$emit('closeFun')">取 消</el-button>
        <el-button type="primary" @click="importProMent" :disabled="goodsListSave.length == 0">导入</el-button>
      </span>
    </div>
  </div>
</template>

<script>
import option from './config/mainLists.json'
import {getListOrder, orderListBySettlement} from "@/api/financialManagement/paymentRequest";

export default {
  name: "index",
  props: {
    billType: {
      type: String
    },
    flag: {
      type: Number
    },
    params: {
      type: Object
    },
    itemId: {
      type: String
    },
    closeFun: {
      type: Function
    }
  },
  data() {
    return {
      activeName: "searchList",
      option: option,
      loading: false,
      search: {},
      data: [],
      selectList: [],
      page: {
        pageSize: 20,
        pagerCount: 1,
        total: 0,
        pageSizes: [20, 200, 300, 500, 700, 1000]
      },
      breakConfiguration: {
        multipleChoices: false,
        multiple: false,
        disabled: false,
        searchShow: true,
        collapseTags: false,
        clearable: true,
        placeholder: '请点击右边按钮选择',
        dicData: []
      },
      goodsListShow: [],
      goodsListSave: []
    }
  },
  watch: {
    'params.corpId'(newVal, oldVal) {
        console.log(newVal,87)
      if (newVal != oldVal) {
        this.onLoad(this.page, this.search)
      }
    },
  },
  async created() {
    // this.option = await this.getColumnData(this.getColumnName(281), option);
  },
    mounted() {
        this.onLoad(this.page,this.params)
    },
    methods: {
    importStagList(row, index) {
      // this.goodsListSave.push(row);
      this.$refs.crud.toggleSelection([row]);
    },
    removeStagList(row, index) {
      this.goodsListSave.splice(row.$index, 1);
    },
    // 标签页切换
    tabHandle(data) {
      if (data.name == "searchList") {
        this.goodsListSave = this.data;
        this.data = this.goodsListShow;
        this.page.total = this.page.totalTwo
      } else if (data.name == "importStaging") {
        this.goodsListShow = this.data;
        this.data = this.goodsListSave;
        this.page.totalTwo = this.page.total;
        this.page.total = 0;
      }
    },
    refreshChange() {
      this.onLoad(this.page);
    },
    searchChange(params, done) {
      if (params.createStart) {
        params.createStartDate = params.createStart[0]
        params.createEndDate = params.createStart[1]
      }
      this.onLoad(this.page, params);
      done()
    },
    selectionChange(row) {
      // this.selectList = row
      this.goodsListSave = row
    },
    onLoad(page, params) {
      if(params && params.rentStartDate ){
        params.createStartDate = params.rentStartDate[0] + " " + "00:00:00"?params.rentStartDate[0] + " " + "00:00:00":'';
        params.createEndDate = params.rentStartDate[1] + " " + "23:59:59"?params.rentStartDate[1] + " " + "23:59:59":'';
        this.$delete(params, 'rentStartDate')
      }
      this.loading = true;
        // 把老数据进行更新  从父组件调用的子组件方法
        if (params.customerId != this.params.customerId) {
            this.params = params
        }
      params = {
        // ...params,
          ...page,
          ...this.params
      }

    // ...this.params 使用之前的老数据 回请求之前的ID造成数据不对
      params.billType = this.billType
      if (this.$store.getters.userInfo.tenant_id === "673511") {
        params.type = "CMY"
      }
      params.flag = this.flag
        if (this.params.bsType == 'XS') {
            params.settlementType = 'd'
        }else {
            params.settlementType = 'c'
        }
      orderListBySettlement(page.currentPage, page.pageSize, params).then(res => {
        this.data = res.data.data.records
        this.page.total = res.data.data.total
      }).finally(() => {
        this.loading = false;
      })
        // getListOrder(page.currentPage, page.pageSize, params).then(res => {
        //     console.log(res,155)
        //     this.data = res.data.data.records
        //     this.page.total = res.data.data.total
        // }).finally(() => {
        //     this.loading = false;
        // })
    },
    importProMent() {
      this.$emit('importProMent', this.goodsListSave);
    },
    //列保存触发
    async saveColumn() {
      const inSave = await this.saveColumnData(
        this.getColumnName(281),
        this.option
      );
      if (inSave) {
        this.$message.success("保存成功");
        //关闭窗口
        this.$refs.crud.$refs.dialogColumn.columnBox = false;
      }
    },
  }
}
</script>
<style scoped></style>