collection.vue

<template>
  <div class="white_bg burt-container">
    <!-- form -->
    <a-form-model ref="form" layout="vertical" :model="form">
      <a-row :gutter="30">
        <a-col :lg="6" :sm="12">
          <a-form-model-item label="保险公司">
            <a-select
              v-model="form.payorCode"
              placeholder="请选择保险公司"
              allowClear
			  show-search
			  :filterOption="filterCode"
            >
              <a-select-option
                v-for="item in companyOptions"
                :key="item.payorCode"
                :value="item.payorCode"
              >
                {{ item.longName }}
              </a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
        <a-col :lg="6" :sm="12">
          <a-form-model-item label="EOB编号">
            <a-input v-model="form.eobNo" placeholder="EOB编号" />
          </a-form-model-item>
        </a-col>
        <a-col :lg="6" :sm="12">
          <a-form-model-item label="创建时间">
            <a-range-picker
              format="YYYY-MM-DD"
              v-model="form.dateRange"
              :placeholder="['开始时间', '结束时间']"
              @change="onSelectVisitTime"
            />
          </a-form-model-item>
        </a-col>
        <a-col :lg="6" :sm="12">
          <a-form-model-item label="状态">
            <a-select
              v-model="form.backStatus"
              placeholder="请选择状态"
              allowClear
            >
              <a-select-option
                v-for="item in backStatusOptions"
                :key="item.value"
                :value="item.value"
              >
                {{ item.name }}
              </a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
        <a-col :lg="6" :sm="12">
          <a-form-model-item label="回款金额">
            <a-input v-model="form.backAmountCny" placeholder="回款金额" />
          </a-form-model-item>
        </a-col>
        <a-col :lg="6" :sm="12">
          <a-form-model-item label="回款编号">
            <a-input v-model="form.backMoneyNo" placeholder="回款编号" />
          </a-form-model-item>
        </a-col>
        <a-col :lg="6" :sm="12">
          <a-form-model-item label="账单编号">
            <a-input v-model="form.receiptNo" placeholder="账单编号" />
          </a-form-model-item>
        </a-col>
        <a-col :md="24" class="none-label">
          <a-form-model-item label="button">
            <a-button class="mar-left10" type="primary" @click="handlerSearch">
              <Icon name="ssisearch_active" :size="14" />查询
            </a-button>
            <a-button
              class="mar-left10"
              type="primary"
              @click.stop="handlerReset"
            >
              <Icon name="ssireset" :size="14" />重置
            </a-button>
            <a-button class="mar-left10" type="primary" @click="addNewEvt">
              <Icon name="ssiadd" :size="14" />新建回款
            </a-button>
            <a-button class="mar-left10" type="primary" @click="exportExcel">
              <Icon name="ssidaochu" :size="14" />导出
            </a-button>
          </a-form-model-item>
        </a-col>
      </a-row>
    </a-form-model>
    <!-- table -->
    <a-table
      :columns="columns"
      :data-source="dataList"
      :scroll="{ x: true }"
      :pagination="false"
    >
      <template slot="eobSts" slot-scope="text">
        {{ text == 1 ? "待回款" : "已回款" }}
      </template>
      <template slot="operation" slot-scope="text, record, index">
        <a-button type="link" @click.stop="editEvt(record, true)"
          >修改</a-button
        >
        <a-button type="link" class="success" @click.stop="editEvt(record)"
          >查看</a-button
        >
        <a-button
          v-if="record.backMoneyNo"
          type="link"
          class="danger"
          @click.stop="delRecord(index)"
          >删除</a-button
        >
      </template>
    </a-table>
    <BurtPagination :pagination="pagination" @pageChange="getData" />
  </div>
</template>

<script>
import BurtPagination from "@/components/Customers/pagation";
import moment from "moment";
import { exportFile } from '@/utils/index';
const columns = [
  { title: "回款编号", dataIndex: "backMoneyNo", ellipsis: true, width: 150 },
  { title: "EOB编号", dataIndex: "eobNos", ellipsis: true, width: 140 },
  { title: "保险公司", dataIndex: "payorName", ellipsis: true, width: 110 },
  {
    title: "回款金额(人民币)",
    dataIndex: "backAmountCny",
    ellipsis: true,
    width: 190,
  },
  {
    title: "未核销余额",
    dataIndex: "residueBackAmount",
    ellipsis: true,
    width: 130,
  },
  { title: "EOB备注", dataIndex: "eobRemark", ellipsis: true, width: 140 },
  { title: "创建时间", dataIndex: "createDate", ellipsis: true, width: 110 },
  { title: "状态", dataIndex: "backStatusStr", ellipsis: true, width: 90 },
  {
    title: "操作",
    dataIndex: "operation",
    scopedSlots: { customRender: "operation" },
    fixed: "right",
    width: "200px",
    align: "center",
  },
];
export default {
  data() {
    return {
      columns,
      form: {
        payorCode: "",
        eobNo: "",
        dateRange: [], //创建时间范围
        startDate: "",
        endDate: "",
        backStatus: "0",
        backAmountCny: "", // 回款金额
        backMoneyNo: "", // 回款编号
        receiptNo:"", // 账单编号
      },
      dataList: [],
      companyOptions: [], //保险公司
      pagination: {
        pageNum: 1,
        pageSize: 10,
        total: 0,
      },
      backStatusOptions: [
        { name: '全部', value: '' },
        { name: '已结案', value: '1' },
        { name: '暂存', value: '0' }
      ],
      iscreated: false
    };
  },
  components: {
    BurtPagination,
  },
  created() {
    this.iscreated = true
    this.getData();
    this._getCompanyOptions();
  },
  activated(){
    if(!this.iscreated){
      this.getData();
      this._getCompanyOptions();
    }else{
      this.iscreated = false
    }
  },
  methods: {
    moment,
    pageChange(pager) {
      const { current } = pager;
      this.pagination.pageNum = current;
      this.getData();
    },
    // 重置
    handlerReset() {
      this.form = {
        payorCode: "",
        eobNo: "",
        dateRange: [], //创建时间范围
        startDate: "",
        endDate: "",
        backStatus: "0",
        receiptNo:"", // 账单编号
      };
    },
	// 选择框筛选
	filterCode(input, option) {
	  return (
	    option.componentOptions.children[0].text
	      .toLowerCase()
	      .indexOf(input.toLowerCase()) >= 0
	  );
	},
    // 获取保险公司下拉选项
    _getCompanyOptions() {
      this.$apis.getCompanyOptions().then((res) => {
        this.companyOptions = res.content || [];
      });
    },
    // 选中就诊时间
    onSelectVisitTime(date, dateString) {
      this.form.startDate = dateString[0] + "";
      this.form.endDate = dateString[1] + "";
    },
    handlerSearch() {
      this.pagination.pageNum = 1;
      this.getData();
    },
    getData() {
      this.$apis
        .queryBackMoneyList({
          ...this.form,
          dateRange: undefined,
          pageNum: this.pagination.pageNum,
          pageSize: this.pagination.pageSize,
        })
        .then((res) => {
          if (res.returnCode == "0000") {
            let content = res.content || {};
            this.pagination.total = content.total || 0;
            this.dataList = content.list.map(item => {
              item.backStatusStr = item.backStatus === '0' ? '暂存' : '已结案'
              return item
            }) || [];
          } else {
            this.$message.error(res.returnMsg);
          }
        });
    },
    //新建回款
    addNewEvt() {
      this.$router.push({
        path: "/verification/collectionDetail",
        query: {
          isEdit: true,
        },
      });
    },
    //编辑回款
    editEvt(record, isEdit) {
      const { backMoneyNo } = record;
      localStorage.setItem("backMoneyDataDetail", JSON.stringify(record));
      console.log(isEdit, record.backStatus)
      // 已结案状态，二次确认
      if (isEdit && record.backStatus === "1") {
        this.$modal.confirm({
          title: "修改",
          content: "处于已结案状态，是否确定修改该条记录？",
          okText: "确认",
          cancelText: "取消",
          onOk: () => {
            this.$router.push({
              path: "/verification/collectionDetail",
              query: {
                backMoneyNo,
                isEdit,
              },
            });
          },
          onCancel: () => {},
        });
        return;
      }
      this.$router.push({
        path: "/verification/collectionDetail",
        query: {
          backMoneyNo,
          isEdit,
        },
      });
    },
    //删除记录
    delRecord(index) {
      let content = "确定删除该条记录？"
      if(this.dataList[index].backStatus === "1") {
        content = "处于已结案状态，确定删除该条记录？"
      }
      this.$modal.confirm({
        title: "删除",
        content,
        okText: "确认",
        cancelText: "取消",
        onOk: () => {
          this.$apis
            .deleteBackMoney({
              backMoneyNo: this.dataList[index].backMoneyNo,
            })
            .then((res) => {
              if (res.returnCode == "0000") {
                this.$message.success("删除成功");
                this.dataList.splice(index, 1);
              } else {
                this.$message.error(res.returnMsg);
              }
            });
        },
        onCancel: () => {},
      });
    },
    //导出报表
    exportExcel(){
			let filter = {
					...this.form,
          dateRange: undefined,
			}
			this.$apis.backMoneyListExport(filter).then(res => {
					exportFile(res, '回款列表.xls');
			})
    }
  },
};
</script>

<style lang="less" scoped>
.none-label {
  text-align: right;
  .ant-form-item-label {
    opacity: 0;
  }
}
.ant-btn .icon-class {
  .mg-r(10);
}
.success.ant-btn-link {
  color: #4cd964;
}
.danger.ant-btn-link {
  color: #ff3b30;
}
</style>