【ECCS-商保-1213】添加账单查询页面

src/api/apis_moudles/charge-query.js

 // 收费查询api
-export default {};
+export default {
+  getChargeList: "/backstage/auth/receiptList",
+  getCompanyOptions: "/backstage/auth/payorListNopage", 
+};

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);
+};
 // 对象数组
-export default {};
+export default {
+  GETCHARGELIST,
+  GETCOMPANYOPTIONS,
+};

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/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="6" :lg="6" :sm="12">
+          <a-form-model-item label="病历号">
+            <a-input
+              v-model="form.patientno"
+              placeholder="请输入病历号"
+            ></a-input>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="6" :lg="6" :sm="12">
+          <a-form-model-item label="客户姓名">
+            <a-input
+              v-model="form.patientname"
+              placeholder="请输入客户姓名"
+            ></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="请选择客户类型">
+              <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="请选择保险公司">
+              <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="请选择看诊医生">
+              <a-select-option
+                v-for="item in doctorOptions"
+                :key="item.code"
+                :value="item.code"
+              >
+                {{ item.name }}
+              </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 @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="请选择支付方式">
+              <a-select-option
+                v-for="item in paymentOptions"
+                :key="item.code"
+                :value="item.code"
+              >
+                {{ item.name }}
+              </a-select-option>
+            </a-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="18" :lg="18" :sm="12" class="none-label">
+          <a-form-model-item label="button">
+            <a-button 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="patientno"
+      :scroll="{ x: true }"
+      :pagination="false"
+      :customRow="handlerRowClick"
+    >
+      <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";
 export default {
-  components: {},
   data() {
-    return {};
+    const columns = [
+      {
+        title: "序号",
+        dataIndex: "id",
+        width: 120,
+      },
+      { title: "就诊状态", dataIndex: "", width: 180 },
+      { title: "收费时间", dataIndex: "", 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: "actualamount", width: 180 },
+      { title: "折扣（%）", dataIndex: "", width: 180 },
 
-  created() {},
-  mounted() {},
-  methods: {},
+      { title: "折后金额", dataIndex: "discountamount", width: 180 },
+      { title: "客户自付", dataIndex: "chargeamount", width: 180 },
+      { title: "减免金额", dataIndex: "reduceamount", width: 180 },
+      { title: "理赔金额", dataIndex: "paidamount", width: 180 },
+      { title: "保险已支付", dataIndex: "", width: 180 },
+      { title: "未清余额", dataIndex: "", width: 180 },
+      { title: "保险欠费", dataIndex: "", width: 180 },
+      { title: "个人欠费", dataIndex: "", 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: [
+        {
+          name: "医生1",
+          code: 1,
+        },
+      ], //就诊医生
+      paymentOptions: [
+        {
+          name: "商保",
+          code: 1,
+        },
+      ], //支付方式
+      dataList: [],
+      pager: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+    };
+  },
+  components: {
+    BurtPagination,
+  },
+  created() {
+    this._getChargeList();
+    this._getCompanyOptions();
+  },
+  methods: {
+    // 获取列表数据
+    _getChargeList() {
+      const data = {
+        ...this.pageForm,
+        ...this.pager,
+      };
+      this.$apis.GETCHARGELIST(data).then((res) => {
+        console.log("获取table信息=", res);
+        this.dataList = (res.content && res.content.list) || [];
+        // this.pager.total = (res.content && res.content.total) || 0;
+      });
+    },
+    // 获取保险公司下拉选项
+    _getCompanyOptions() {
+      this.$apis.GETCOMPANYOPTIONS().then((res) => {
+        console.log("获取保险公司下拉选项", res);
+        this.companyOptions = res.content || [];
+      });
+    },
+
+    // 选中就诊时间
+    onSelectVisitTime(date, dateString) {
+      console.log(date, dateString);
+    },
+    handlerReset() {
+      console.log("重置");
+    },
+
+    handlerRowClick(record) {
+      const { id, patientPolicyId } = record;
+      return {
+        style: {
+          color: record.isEdit ? "#2B63FF" : "#252631",
+        },
+        on: {
+          click: () => {
+            if (record.isEdit) {
+              return true;
+            }
+            this.$router.push({
+              name: "welfare",
+              query: { id, patientPolicyId },
+            });
+          },
+        },
+      };
+    },
+    // 修改按钮
+    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==