Merge branch 'func_1213' of git.ssish.com:sunhailiang/bims into yanglilong

src/api/apis_moudles/charge-query.js

 // 收费查询api
-export default {};
+export default {
+  getChargeList: "/backstage/auth/receiptList",
+  getCompanyOptions: "/backstage/auth/payorListNopage", 
+  getDoctorListNoPage:"/backstage/auth/doctorListNoPage",//医生列表
+  getChargeListDetail:"/backstage/auth/receiptDetailList",//账单明细
+  getReceiptPaymentDetail:"/backstage/auth/receiptPaymentDetail",//账单明细
+};

src/api/funcs_modules/charge-query.js

 // 收费查询函数库
-// import apis from "../apis_moudles/index";
-// import req from "../request";
+import apis from "../apis_moudles/";
+import req from "../request";
+// get charge list
+const GETCHARGELIST = function (data) {
+  return req.post(apis.getChargeList, data);
+};
+//获取保险公司数据
+const GETCOMPANYOPTIONS = function (data) {
+  return req.post(apis.getCompanyOptions, data);
+};
+// 获取医生列表
+const GETDOCTORlISTNOPAGE= function (data) {
+  return req.post(apis.getDoctorListNoPage, data);
+};
+// get charge detail list
+const GETCHARGELISTDETAIL = function (data) {
+  return req.post(apis.getChargeListDetail, data);
+};
+// 获取费用支付明细
+const GETRECEIPTPAYMENTDETAIL= function (data) {
+  return req.post(apis.getReceiptPaymentDetail, data);
+};
 // 对象数组
-export default {};
+export default {
+  GETCHARGELIST,
+  GETCOMPANYOPTIONS,
+  GETDOCTORlISTNOPAGE,
+  GETCHARGELISTDETAIL,
+  GETRECEIPTPAYMENTDETAIL
+};

src/router/modules/charge-query.js

 // 收费查询路由表,分包名称:charge-query
+import Layout from '@/layout'
 export default {
   path: "/charge-query",
-  name: "ChargeQuery",
-  component: () => {
-    return import(/* webpackChunkName: "chargeQuery" */ "@/views/charge-query");
+  name: "chargeQuery",
+  component: Layout,
+  children: [
+    {
+      path:'',
+      name: "chargeQueryIndex",
+      component: () => import(/* webpackChunkName: "chargeQuery" */"@/views/charge-query/index.vue")
     },
+    {
+      path: "detail",
+      name: "chargeQueryDetail",
+      component: () => import(/* webpackChunkName: "chargeQuery" */"@/views/charge-query/detail.vue")
+    }
+  ]
 };

src/router/modules/menu.js

@@ -37,9 +37,14 @@ export default [
   },
   {
     icon: "ssisearch",
-    path: "/charge-query",
+    path: "charge-query",
     title: "收费查询",
-    children: [],
+    children: [
+      {
+        path: "/charge-query",
+        title: "账单查询",
+      },
+    ],
   },
   {
     icon: "ssiorder",

src/views/charge-query/detail.vue

+<template>
+  <!-- -账单明细 -->
+  <div class="white_bg burt-container custom-info">
+    <!-- form -->
+    <a-form-model ref="form" layout="vertical" :model="form">
+      <a-row :gutter="30">
+        <a-col :xl="4" :lg="6" :sm="12">
+          <a-form-model-item label="病历号">
+            <a-input
+              v-model="form.patientNo"
+              placeholder="请输入病历号"
+              allow-clear
+            ></a-input>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="4" :lg="6" :sm="12">
+          <a-form-model-item label="客户姓名">
+            <a-input
+              v-model="form.patientName"
+              placeholder="请输入客户姓名"
+              allow-clear
+            ></a-input>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="4" :lg="6" :sm="12">
+          <a-form-model-item label="客户类型">
+            <a-select
+              v-model="form.patientType"
+              placeholder="请选择客户类型"
+              allowClear
+            >
+              <a-select-option
+                v-for="item in patientTypeOptions"
+                :key="item.code"
+                :value="item.code"
+              >
+                {{ item.name }}
+              </a-select-option>
+            </a-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="4" :lg="6" :sm="12">
+          <a-form-model-item label="保险公司">
+            <a-select
+              v-model="form.payorId"
+              placeholder="请选择保险公司"
+              allowClear
+            >
+              <a-select-option
+                v-for="item in companyOptions"
+                :key="item.corpCode"
+                :value="item.id"
+              >
+                {{ item.longName }}
+              </a-select-option>
+            </a-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="4" :lg="6" :sm="12">
+          <a-form-model-item label="看诊医生">
+            <a-select
+              v-model="form.doctorCode"
+              placeholder="请选择看诊医生"
+              allowClear
+            >
+              <a-select-option
+                v-for="item in doctorOptions"
+                :key="item.doctorCode"
+                :value="item.doctorCode"
+              >
+                {{ item.doctorDesc }}
+              </a-select-option>
+            </a-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="5" :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 :xl="3" :lg="6" :sm="12">
+          <a-form-model-item label="支付方式">
+            <a-select
+              v-model="form.paymentCode"
+              placeholder="请选择支付方式"
+              allowClear
+            >
+              <a-select-option
+                v-for="item in paymentOptions"
+                :key="item.code"
+                :value="item.code"
+                allow-clear
+              >
+                {{ item.name }}
+              </a-select-option>
+            </a-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="12" :lg="12" :sm="12" class="none-label">
+          <a-form-model-item label="button">
+            <a-button>更新数据</a-button>
+            <a-button class="mar-left10" type="primary" @click="addNewCharge">
+              <Icon name="ssiadd" :size="14" />新建预授权</a-button
+            >
+            <a-button class="mar-left10" type="primary" @click="handlerReset">
+              <Icon name="ssireset" :size="14" />重置
+            </a-button>
+            <a-button class="mar-left10" type="primary" @click="handlerSearch">
+              <Icon name="ssisearch_active" :size="14" />查询
+            </a-button>
+          </a-form-model-item>
+        </a-col>
+      </a-row>
+    </a-form-model>
+
+    <!-- table -->
+    <a-table
+      :columns="columns"
+      :data-source="dataList"
+      row-key="id"
+      :scroll="{ x: true }"
+      :customRow="handlerRowClick"
+      :pagination="true"
+    >
+      <template slot="operation" slot-scope="record">
+        <a-button
+          v-if="record.isEdit"
+          type="link"
+          @click.stop="saveChange(record)"
+          >保存</a-button
+        >
+        <a-button v-else type="link" @click.stop="changeDataStatus(record)"
+          >修改</a-button
+        >
+        <!-- <a-button type="link" class="success">查看</a-button> -->
+        <a-popconfirm
+          title="你确定要关闭吗？"
+          ok-text="确定"
+          cancel-text="取消"
+          @confirm="deleteData"
+        >
+          <a-button type="link" class="danger">删除</a-button>
+        </a-popconfirm>
+      </template>
+    </a-table>
+    <!--分页-->
+    <BurtPagination :pagination="pager" @pageChange="_getChargeListDetail" />
+
+    <div class="title-div">费用支付明细</div>
+    <a-table
+      :columns="payColumns"
+      :data-source="payDataList"
+      row-key="id"
+      :scroll="{ x: true }"
+      :pagination="false"
+      class="payTable"
+    >
+      <template slot="paymentType" slot-scope="text">
+        <a-button class="danger">{{ text | payStyleFilters }}</a-button>
+      </template>
+    </a-table>
+  </div>
+</template>
+
+<script>
+import BurtPagination from "@/components/CUSTOMER/pagation";
+import { mapState } from "vuex"
+export default {
+  data() {
+    const columns = [
+      { title: "项目", dataIndex: "itemcatDesc", width: 180 },
+      {
+        title: "项目明细",
+        dataIndex: "itemDesc",
+        width: 180,
+      },
+      {
+        title: "单价",
+        dataIndex: "itemPrice",
+        width: 120,
+      },
+      { title: "数量", dataIndex: "itemQty", width: 180 },
+      { title: "单位", dataIndex: "itemUnit", width: 180 },
+      { title: "金额", dataIndex: "chargeAmount", width: 180 },
+      { title: "折扣（%）", dataIndex: "discountAmount", width: 180 },
+      { title: "折后金额", dataIndex: "actualAmount", width: 180 },
+      { title: "减免金额", dataIndex: "reduceAmount", width: 180 },
+      { title: "实际金额", dataIndex: "paidAmount", width: 180 },
+
+      { title: "免赔额", dataIndex: "deductible", width: 180 },
+      { title: "自付额", dataIndex: "selfPaid", width: 180 },
+      { title: "其他费用", dataIndex: "otherPaid", width: 180 },
+      { title: "实际金额", dataIndex: "actualPaid", width: 180 },
+      {
+        title: "操作",
+        key: "operation",
+        width: "175px",
+        fixed: "right",
+        scopedSlots: { customRender: "operation" },
+      },
+    ];
+    const payColumns = [
+      { title: "免赔额", dataIndex: "deductible", width: 180 },
+      { title: "自付额", dataIndex: "selfPaid", width: 180 },
+      { title: "其他费用", dataIndex: "otherPaid", width: 180 },
+      { title: "个人支付", dataIndex: "personalPaid", width: 180 },
+      { title: "商保支付", dataIndex: "ciPaid", width: 180 },
+      {
+        title: "支付方式",
+        dataIndex: "paymentType",
+        width: 180,
+        scopedSlots: { customRender: "paymentType" },
+      },
+    ];
+    return {
+      receiptNo: "",
+      columns,
+      payColumns,
+      form: {},
+      pageForm: {
+        doctorCode: "",
+        patientName: "",
+        patientNo: "",
+        paymentCode: "",
+        payorId: 0,
+        visitTimeEnd: "",
+        visitTimeStart: "",
+      },
+      patientTypeOptions: [
+        {
+          name: "商保",
+          code: 1,
+        },
+      ], //客户类型
+      companyOptions: [], //保险公司
+      doctorOptions: [], //就诊医生
+      paymentOptions: [
+        {
+          name: "商保",
+          code: 1,
+        },
+      ], //支付方式
+      dataList: [],
+      pager: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+      payDataList: [],
+      payPager: [
+        {
+          pageNum: 1,
+          pageSize: 10,
+        },
+      ],
+    };
+  },
+  components: {
+    BurtPagination,
+  },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.common.userInfo
+    })
+  },
+  filters: {
+    payStyleFilters(value) {
+      const styleMap = {
+        1: "支付宝",
+        2: "微信",
+        3: "现金",
+      };
+      return styleMap[value];
+    },
+  },
+  created() {
+    const { receiptNo } = this.$route.query;
+    this.receiptNo = receiptNo || "";
+
+    this._getChargeListDetail();
+    this._getCompanyOptions();//获取保险公司下拉选项
+    this._getDoctorListNoPage();//获取看诊医生下拉选项
+    this._getReceiptPaymentDetail(); //费用支付明细
+  },
+  methods: {
+    // 获取列表数据
+    _getChargeListDetail() {
+      const data = {
+        receiptNo: this.receiptNo,
+        ...this.pager,
+      };
+      this.$apis.GETCHARGELISTDETAIL(data).then((res) => {
+        console.log("11111111111获取table信息=", res);
+        if (res.returnCode == "0000") {
+          this.dataList = (res.content && res.content.list) || [];
+          // this.pager.total = (res.content && res.content.total) || 0;
+        } else {
+          this.$message.error(res.returnMsg);
+        }
+      });
+    },
+    // 获取保险公司下拉选项
+    _getCompanyOptions() {
+      this.$apis.GETCOMPANYOPTIONS().then((res) => {
+        console.log("获取保险公司下拉选项", res);
+        if (res.returnCode == "0000") {
+          this.companyOptions = res.content || [];
+        } else {
+          this.$message.error(res.returnMsg);
+        }
+      });
+    },
+    // 获取看诊医生下拉选项
+    _getDoctorListNoPage(){
+      this.$apis.GETDOCTORlISTNOPAGE({"providerId": this.userInfo.providerId}).then((res) => {
+        if (res.returnCode === "0000") {
+          this.doctorOptions = res.content || [];
+        }else{
+          this.$message.success(res.returnMsg);
+        }
+        
+      });
+    },
+    // 获取费用支付明细
+    _getReceiptPaymentDetail() {
+      const params = {
+        receiptNo: this.receiptNo,
+        ...this.payPager,
+      };
+      this.$apis.GETRECEIPTPAYMENTDETAIL(params).then((res) => {
+        console.log("获取费用支付明细", res);
+        if (res.returnCode == "0000") {
+          let content = res.content || {};
+          this.payDataList = content;
+        } else {
+          this.$message.error(res.returnMsg);
+        }
+      });
+    },
+
+    // 选中就诊时间
+    onSelectVisitTime(date, dateString) {
+      console.log(date, dateString);
+    },
+    // 重置
+    handlerReset() {
+      this.form = {};
+    },
+
+    //设置行属性
+    handlerRowClick(record) {
+      const { receiptNo } = record;
+      console.log("receiptNo=", receiptNo);
+      return {
+        style: {
+          color: record.isEdit ? "#2B63FF" : "#252631",
+        },
+        on: {
+          // 点击行
+          click: () => {
+            if (record.isEdit) {
+              return true;
+            }
+            this.$router.push({
+              name: "chargeQueryDetail",
+              query: { receiptNo },
+            });
+          },
+        },
+      };
+    },
+    // 修改按钮
+    changeDataStatus(record) {
+      this.$set(record, "isEdit", true);
+    },
+    saveChange(record) {
+      record.isEdit = undefined;
+      record.isNew = undefined;
+    },
+    handlerSearch() {
+      this.$refs.form.validate((valid) => {
+        if (!valid) {
+          return false;
+        }
+        this.pager.pageNum = 1;
+        this.pageForm = this.$lodash.cloneDeep(this.form);
+        this._getChargeListDetail();
+      });
+    },
+    deleteData() {
+      this.$message.success("删除成功");
+    },
+    // 新建账单信息
+    addNewCharge() {
+      // this.$router.push("/customer/edit");
+    },
+  },
+};
+</script>
+<style lang="less" scoped>
+.none-label {
+  text-align: right;
+  .ant-form-item-label {
+    opacity: 0;
+  }
+}
+.ant-btn .icon-class {
+  .mg-r(10);
+}
+.title-div {
+  line-height: 56px;
+  color: #252631;
+  font-weight: bold;
+  border-bottom: 1px solid #eee;
+}
+.payTable{
+  .ant-btn{
+    border-color: #1890ff;
+    color: #1890ff;
+  }
+}
+</style>

src/views/charge-query/index.vue

 <template>
-  <div>
-    <!-- 费用查询 -->
-    费用查询
+  <!-- 收费查询-账单查询 -->
+  <div class="white_bg burt-container custom-info">
+    <!-- form -->
+    <a-form-model ref="form" layout="vertical" :model="form">
+      <a-row :gutter="30">
+        <a-col :xl="4" :lg="6" :sm="12">
+          <a-form-model-item label="病历号">
+            <a-input
+              v-model="form.patientNo"
+              placeholder="请输入病历号"
+              allow-clear
+            ></a-input>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="4" :lg="6" :sm="12">
+          <a-form-model-item label="客户姓名">
+            <a-input
+              v-model="form.patientName"
+              placeholder="请输入客户姓名"
+               allow-clear
+            ></a-input>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="4" :lg="6" :sm="12">
+          <a-form-model-item label="客户类型">
+            <a-select v-model="form.patientType" placeholder="请选择客户类型" allowClear>
+              <a-select-option
+                v-for="item in patientTypeOptions"
+                :key="item.code"
+                :value="item.code"
+              >
+                {{ item.name }}
+              </a-select-option>
+            </a-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="4" :lg="6" :sm="12">
+          <a-form-model-item label="保险公司">
+            <a-select v-model="form.payorId" placeholder="请选择保险公司" allowClear>
+              <a-select-option
+                v-for="item in companyOptions"
+                :key="item.corpCode"
+                :value="item.id"
+              >
+                {{ item.longName }}
+              </a-select-option>
+            </a-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="4" :lg="6" :sm="12">
+          <a-form-model-item label="看诊医生">
+            <a-select v-model="form.doctorCode" placeholder="请选择看诊医生" allowClear>
+              <a-select-option
+                v-for="item in doctorOptions"
+                :key="item.doctorCode"
+                :value="item.doctorCode"
+              >
+                {{ item.doctorDesc }}
+              </a-select-option>
+            </a-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="5" :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 :xl="3" :lg="6" :sm="12">
+          <a-form-model-item label="支付方式">
+            <a-select v-model="form.paymentCode" placeholder="请选择支付方式" allowClear>
+              <a-select-option
+                v-for="item in paymentOptions"
+                :key="item.code"
+                :value="item.code"
+                 allow-clear
+              >
+                {{ item.name }}
+              </a-select-option>
+            </a-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="12" :lg="12" :sm="12" class="none-label">
+          <a-form-model-item label="button">
+            <a-button>更新数据</a-button>
+            <a-button class="mar-left10" type="primary" @click="addNewCharge">
+              <Icon name="ssiadd" :size="14" />新建预授权</a-button
+            >
+            <a-button class="mar-left10" type="primary" @click="handlerReset">
+              <Icon name="ssireset" :size="14" />重置
+            </a-button>
+            <a-button class="mar-left10" type="primary" @click="handlerSearch">
+              <Icon name="ssisearch_active" :size="14" />查询
+            </a-button>
+          </a-form-model-item>
+        </a-col>
+      </a-row>
+    </a-form-model>
+
+    <!-- table -->
+    <a-table
+      :columns="columns"
+      :data-source="dataList"
+      row-key="id"
+      :scroll="{ x: true }"
+      :customRow="handlerRowClick"
+      :pagination="true"
+    >
+      <template slot="operation" slot-scope="record">
+        <a-button
+          v-if="record.isEdit"
+          type="link"
+          @click.stop="saveChange(record)"
+          >保存</a-button
+        >
+        <a-button v-else type="link" @click.stop="changeDataStatus(record)"
+          >修改</a-button
+        >
+        <a-button type="link" class="success">查看</a-button>
+        <a-popconfirm
+          title="你确定要关闭吗？"
+          ok-text="确定"
+          cancel-text="取消"
+          @confirm="deleteData"
+        >
+          <a-button type="link" class="danger">删除</a-button>
+        </a-popconfirm>
+      </template>
+    </a-table>
+    <!--分页-->
+    <BurtPagination :pagination="pager" @pageChange="_getChargeList" />
   </div>
 </template>
 
 <script>
+import BurtPagination from "@/components/CUSTOMER/pagation";
+import { mapState } from "vuex"
 export default {
-  components: {},
   data() {
-    return {};
+    const columns = [
+      {
+        title: "序号",
+        dataIndex: "index",
+        key:"index",
+        align:'center',
+        width: 80,
+        customRender: (text, record, index) => {
+          return `${index+1}`
+        },
+      },
+      { title: "收费时间", dataIndex: "receiptDate", width: 180 },
+      {
+        title: "病历号",
+        dataIndex: "patientNo",
+        width: 180,
+        customRender: (val, row) => {
+          if (row.isEdit) {
+            return <a-input v-model={row.patientNo}></a-input>;
+          }
+          return val;
+        },
+      },
+      {
+        title: "客户姓名",
+        dataIndex: "patientName",
+        width: 120,
+        customRender: (val, row) => {
+          if (row.isEdit) {
+            return <a-input v-model={row.patientName}></a-input>;
+          }
+          return val;
         },
+      },
+      { title: "客户类型", dataIndex: "patientType", width: 180 },
+      { title: "保险公司", dataIndex: "payorName", width: 180 },
+      { title: "就诊时间", dataIndex: "visitTime", width: 180 },
+      { title: "就诊医生", dataIndex: "doctorName", width: 180 },
+      { title: "账单金额", dataIndex: "chargeAmount", width: 180 },
+      { title: "折扣（%）", dataIndex: "discountAmount", width: 180 },
 
-  created() {},
-  mounted() {},
-  methods: {},
+      { title: "折后金额", dataIndex: "actualAmount", width: 180 },
+      { title: "客户自付", dataIndex: "paidAmount", width: 180 },
+      { title: "减免金额", dataIndex: "reduceamount", width: 180 },
+      { title: "理赔金额", dataIndex: "paidamount", width: 180 },
+      { title: "保险已支付", dataIndex: "insurancePaidAmount", width: 180 },
+      { title: "未清余额", dataIndex: "outstandAmount", width: 180 },
+      { title: "保险欠费", dataIndex: "insuranceArrearsAmount", width: 180 },
+      { title: "个人欠费", dataIndex: "personalArrearsAmount", width: 180 },
+      { title: "发票号码", dataIndex: "receiptNo", width: 180 },
+      {
+        title: "操作",
+        key: "operation",
+        width: "175px",
+        fixed: "right",
+        scopedSlots: { customRender: "operation" },
+      },
+    ];
+    return {
+      columns,
+      form: {},
+      pageForm: {
+        doctorCode: "",
+        patientName: "",
+        patientNo: "",
+        paymentCode: "",
+        payorId: 0,
+        visitTimeEnd: "",
+        visitTimeStart: "",
+      },
+      patientTypeOptions: [
+        {
+          name: "商保",
+          code: 1,
+        },
+      ], //客户类型
+      companyOptions: [], //保险公司
+      doctorOptions: [], //就诊医生
+      paymentOptions: [
+        {
+          name: "商保",
+          code: 1,
+        },
+      ], //支付方式
+      dataList: [],
+      pager: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+    };
+  },
+  components: {
+    BurtPagination,
+  },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.common.userInfo
+    })
+  },
+  created() {
+    this._getChargeList();
+    this._getCompanyOptions();
+    this._getDoctorListNoPage();//获取医生下拉选项
+  },
+  methods: {
+    // 获取列表数据
+    _getChargeList() {
+      const data = {
+        ...this.pageForm,
+        ...this.pager,
+      };
+      this.$apis.GETCHARGELIST(data).then((res) => {
+        this.dataList = (res.content && res.content.list) || [];
+        // this.pager.total = (res.content && res.content.total) || 0;
+      });
+    },
+    // 获取保险公司下拉选项
+    _getCompanyOptions() {
+      this.$apis.GETCOMPANYOPTIONS().then((res) => {
+        this.companyOptions = res.content || [];
+      });
+    },
+    // 获取看诊医生下拉选项
+    _getDoctorListNoPage(){
+      this.$apis.GETDOCTORlISTNOPAGE({"providerId": this.userInfo.providerId}).then((res) => {
+        if (res.returnCode === "0000") {
+          this.doctorOptions = res.content || [];
+        }else{
+          this.$message.success(res.returnMsg);
+        }
+        
+      });
+    },
+    // 选中就诊时间
+    onSelectVisitTime(date, dateString) {
+      console.log(date, dateString);
+    },
+    // 重置
+    handlerReset() {
+      this.form = {}
+    },
+    
+    //设置行属性 
+    handlerRowClick(record) {
+      const { receiptNo } = record;
+      return {
+        style: {
+          color: record.isEdit ? "#2B63FF" : "#252631",
+        },
+        on: {
+      // 点击行
+          click: () => {
+            if (record.isEdit) {
+              return true;
+            }
+            this.$router.push({
+              name: "chargeQueryDetail",
+              query: { receiptNo },
+            });
+          },
+        },
+      };
+    },
+    // 修改按钮
+    changeDataStatus(record) {
+      this.$set(record, "isEdit", true);
+    },
+    saveChange(record) {
+      record.isEdit = undefined;
+      record.isNew = undefined;
+    },
+    handlerSearch() {
+      this.$refs.form.validate((valid) => {
+        if (!valid) {
+          return false;
+        }
+        this.pager.pageNum = 1;
+        this.pageForm = this.$lodash.cloneDeep(this.form);
+        this._getChargeList();
+      });
+    },
+    deleteData() {
+      this.$message.success("删除成功");
+    },
+    // 新建账单信息
+    addNewCharge() {
+      // this.$router.push("/customer/edit");
+    },
+  },
 };
 </script>
-
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.none-label {
+  text-align: right;
+  .ant-form-item-label {
+    opacity: 0;
+  }
+}
+.ant-btn .icon-class {
+  .mg-r(10);
+}
+</style>

yarn.lock

@@ -5939,7 +5939,7 @@ mkdirp@^1.0.3, mkdirp@^1.0.4:
   resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-1.0.4.tgz#3eb5ed62622756d79a5f0e2a221dfebad75c2f7e"
   integrity sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==
 
-moment@^2.21.0:
+moment@^2.21.0, moment@^2.29.1:
   version "2.29.1"
   resolved "https://registry.yarnpkg.com/moment/-/moment-2.29.1.tgz#b2be769fa31940be9eeea6469c075e35006fa3d3"
   integrity sha512-kHmoybcPV8Sqy59DwNDY3Jefr64lK/by/da0ViFcuA4DH0vQg5Q6Ze5VimxkfQNSC+Mls/Kx53s7TjP1RhFEDQ==