福利处理完成

src/api/apis_moudles/welfare.js

 // 福利管理api
 export default {
   benefitType: "/backstage/auth/benefitMasterList",
+  planList: "/backstage/auth/planListPage",
+  editPlan: "/backstage/auth/planEdit",
+  coverageCode: "/backstage/auth/coverageMasterList",
   coverageList: "/backstage/auth/coverageList",
+  addCoverage: "/backstage/auth/createCoverage",
+  editCoverage: "/backstage/auth/coverageEdit",
+  conditionList: "/backstage/auth/conditionList",
+  addCondition: "/backstage/auth/conditionCreate",
+  editCondition: "/backstage/auth/conditionEdit",
+  benefitList: "/backstage/auth/benefitList",
+  addBenefit: "/backstage/auth/createBenefit",
+  editBenefit: "/backstage/auth/benefitEdit",
+  getFrequencyCode: "/backstage/auth/frequencyList",
+  getLimitCode: "/backstage/auth/limitList",
 };

src/api/funcs_modules/welfare.js

@@ -6,9 +6,77 @@ const GETBENEGITTYPE = () => {
   return req.post(apis.benefitType);
 };
 
+const GETPLANLIST = (data) => {
+  return req.post(apis.planList, data);
+};
+
+const EDITPLANDATE = (data) => {
+  return req.post(apis.editPlan, data);
+};
+
 const GETCOVERAGELIST = (data) => {
   return req.post(apis.coverageList, data);
 };
 
+const GETCONDITIONLIST = (data) => {
+  return req.post(apis.conditionList, data);
+};
+
+const ADDCONDITIONDATA = (data) => {
+  return req.post(apis.addCondition, data);
+};
+
+const EDITCONDITIONDATA = (data) => {
+  return req.post(apis.editCondition, data);
+};
+
+const GETBENEFITLIST = (data) => {
+  return req.post(apis.benefitList, data);
+};
+
+const ADDBENEFITLIST = (data) => {
+  return req.post(apis.addBenefit, data);
+};
+
+const EDITBENEFITLIST = (data) => {
+  return req.post(apis.editBenefit, data);
+};
+
+const GETCOVERAGECODE = (data) => {
+  return req.post(apis.coverageCode, data);
+};
+
+const ADDCOVERAGEDATA = (data) => {
+  return req.post(apis.addCoverage, data);
+};
+
+const EDITCOVERAGEDATA = (data) => {
+  return req.post(apis.editCoverage, data);
+};
+
+const GETFREQUENCYCODE = (data) => {
+  return req.post(apis.getFrequencyCode, data);
+};
+
+const GETLIMITCODE = (data) => {
+  return req.post(apis.getLimitCode, data);
+};
+
 // 对象数组
-export default { GETBENEGITTYPE, GETCOVERAGELIST };
+export default {
+  GETBENEGITTYPE,
+  GETPLANLIST,
+  EDITPLANDATE,
+  GETCOVERAGELIST,
+  GETCONDITIONLIST,
+  ADDCONDITIONDATA,
+  EDITCONDITIONDATA,
+  GETBENEFITLIST,
+  ADDBENEFITLIST,
+  EDITBENEFITLIST,
+  GETCOVERAGECODE,
+  ADDCOVERAGEDATA,
+  EDITCOVERAGEDATA,
+  GETFREQUENCYCODE,
+  GETLIMITCODE,
+};

src/api/state_code.js

@@ -17,6 +17,9 @@ const TOKEN_INVLIDE_TO_LOGIN = (code) => {
     store.commit("user/setUserInfo", "");
     route.replace({
       path: "/login",
+      query: {
+        refirect: route.currentRoute.fullPath,
+      },
     });
     return false;
   } else {

src/assets/style/common.less

@@ -31,6 +31,9 @@ button::-moz-focus-inner {
 .mar-left10 {
     .mg-l(30);
 }
+.mar-bottom10 {
+    .mg-b(20);
+}
 
 // 媒体查询
 // 文本超长

src/assets/style/reset.less

@@ -238,7 +238,8 @@ select {
         font-family: PingFangSC-Medium, PingFang SC;
     }
 }
-.ant-calendar-picker {
+.ant-calendar-picker,
+.ant-input-number {
     width: 100%;
 }
 // .ant-table,
@@ -271,6 +272,7 @@ select {
 }
 
 .ant-input,
+.ant-input-number,
 .ant-select-selection {
   border: none;
   background-color: #f8fafb;

src/components/Antd/index.js

@@ -19,7 +19,8 @@ import {
   popconfirm,
   Modal,
   modal,
-  Spin
+  Spin,
+  Collapse,
 } from "ant-design-vue";
 
 export default () => {
@@ -43,7 +44,8 @@ export default () => {
     popconfirm,
     Modal,
     modal,
-    Spin
+    Spin,
+    Collapse,
   ];
   // 注册
   els.forEach((item) => {

src/components/CUSTOMER/pagation/index.vue

@@ -67,12 +67,12 @@ export default {
       this.jumpPage = this.jumpPage < 0 ? 0 : this.jumpPage;
       this.jumpPage = this.jumpPage > pages ? pages : this.jumpPage;
       this.pagination.pageNum = this.jumpPage;
-      this.$emit("pageChange");
+      this.$emit("pageChange", { pageNum: this.jumpPage });
     },
     //改变分页
     pageChange(pager) {
       this.pagination.pageNum = pager;
-      this.$emit("pageChange");
+      this.$emit("pageChange", { pageNum: pager });
     },
   },
 };

src/router/modules/customer.js

 // 客户信息路由表,分包名称:customer
 export default {
-  path: "/customer",
+  path: "/",
   redirect: "customerInfo",
   component: () => {
     return import(/* webpackChunkName: "customer" */ "@/views/customer");
   },
   children: [
     {
-      path: "",
+      path: "customer",
       name: "customerInfo",
       component: () => import("@/views/customer/info"),
     },
     {
-      path: "edit",
+      path: "customer/edit",
       name: "customerEdit",
       component: () => import("@/views/customer/edit"),
     },

src/router/modules/menu.js

@@ -16,9 +16,18 @@ export default [
   },
   {
     icon: "ssimanage_msg",
-    path: "/welfare",
+    path: "2",
     title: "福利信息管理",
-    children: [],
+    children: [
+      {
+        path: "/welfare",
+        title: "福利信息明细",
+      },
+      {
+        path: "/welfare/edit",
+        title: "福利信息管理",
+      },
+    ],
   },
   {
     icon: "ssimanage",

src/router/modules/welfare.js

 // 福利管理路由表,分包名称:welfare
 export default {
-  path: "/welfare",
-  name: "welfare",
+  path: "/",
   component: () => {
     return import(/* webpackChunkName: "Welfare" */ "@/views/welfare");
   },
+  children: [
+    {
+      path: "welfare",
+      name: "welfareInfo",
+      component: () => import("@/views/welfare/info"),
+    },
+    {
+      path: "welfare/edit",
+      name: "welfareEdit",
+      component: () => import("@/views/welfare/edit"),
+    },
+  ],
 };

src/views/author/login.vue

 <template>
   <div class="login">
-    <h2 class="title">{{title}}</h2>
+    <h2 class="title">{{ title }}</h2>
     <div class="content">
       <p class="module-title">
         <span>密码登录</span>
@@ -33,7 +33,9 @@
           </a-input>
         </a-form-model-item>
         <a-form-model-item>
-          <a-button type="primary" block @click.stop="handlerLogin">登录</a-button>
+          <a-button type="primary" block @click.stop="handlerLogin"
+            >登录</a-button
+          >
         </a-form-model-item>
       </a-form-model>
     </div>
@@ -49,7 +51,7 @@ export default {
       form: {
         userName: process.env.VUE_APP_USER || "",
         passWord: process.env.VUE_APP_PWD || "",
-        verificationCode: ""
+        verificationCode: "",
       },
       formRules: {
         userName: [{ required: true, message: "请输入用户名" }],
@@ -81,7 +83,8 @@ export default {
       this.$apis.LOGIN(this.form).then((res) => {
         if (res.returnCode === "0000") {
           this.$store.commit("common/setUserInfo", res.content);
-          this.$router.replace("/customer");
+          const path = this.$router.query.redirect || "/customer";
+          this.$router.replace(path);
         } else {
           this.$message.error(res.returnMsg || "出现错误");
           this.form.verificationCode = "";

src/views/customer/edit/index.vue

@@ -212,9 +212,9 @@
       <a-row>
         <a-col :xl="24" :lg="18" :sm="12" class="none-label clearfix">
           <a-form-model-item label="button">
-            <a-button type="primary">
+            <!-- <a-button type="primary">
               <Icon name="ssiprint" :size="14" />打印理赔申请书
-            </a-button>
+            </a-button> -->
             <a-button
               type="primary"
               class="mar-left10 text-r"
@@ -240,6 +240,10 @@
 
 <script>
 export default {
+  beforeRouteUpdate(to, from, next) {
+    this.$refs.form.resetFields();
+    next();
+  },
   data() {
     return {
       previewVisible: false,
@@ -264,6 +268,9 @@ export default {
     };
   },
   mounted() {
+    if (this.$route.query && this.$route.query.id) {
+      this.getCustomerDetail(this.$route.query);
+    }
     this._getPayorCode();
   },
   methods: {
@@ -319,6 +326,23 @@ export default {
         ];
       }
     },
+    getCustomerDetail(params) {
+      // this.queryForm = this.$lodash.cloneDeep(this.form);
+      const { id, patientPolicyId } = params;
+      const data = {
+        id: id && id * 1,
+        patientPolicyId: patientPolicyId * 1,
+      };
+      this.$apis.GETCUSTOMERDETAIL(data).then((res) => {
+        if (res.returnCode === "0000") {
+          this.form = res.content || {};
+          this._getCorporateCode(this.form.payorId);
+          this._getPlanCode(this.form.corpId);
+        }
+        // this.dataList = (res.content && res.content.list) || [];
+        // this.total = (res.content && res.content.total) || 0;
+      });
+    },
     codeSearch(val) {
       if (!val) {
         this.comPlanCode = this.planCode;

src/views/customer/info/index.vue

@@ -68,16 +68,11 @@
       :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 type="link" @click.stop="changeDataStatus(record)"
           >修改</a-button
         >
-        <a-button type="link" class="success">新增</a-button>
+        <a-button type="link">打印理赔申请书</a-button>
+        <!-- <a-button type="link" class="success">新增</a-button> -->
         <a-popconfirm
           title="你确定要关闭吗？"
           ok-text="确定"
@@ -102,23 +97,11 @@ export default {
         title: "病历号",
         dataIndex: "mrnNo",
         width: 180,
-        customRender: (val, row) => {
-          if (row.isEdit) {
-            return <a-input v-model={row.mrnNo}></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: "birthday", width: 180 },
       { title: "性别", dataIndex: "sex", width: 80 },
@@ -129,7 +112,7 @@ export default {
       {
         title: "操作",
         key: "operation",
-        width: "175px",
+        width: "260px",
         fixed: "right",
         scopedSlots: { customRender: "operation" },
       },
@@ -143,12 +126,12 @@ export default {
       pager: {
         pageNum: 1,
         pageSize: 10,
-        total: 0
-      }
+        total: 0,
+      },
     };
   },
   components: {
-    BurtPagination
+    BurtPagination,
   },
   created() {
     this._getCustomerList();
@@ -167,7 +150,7 @@ export default {
               return true;
             }
             this.$router.push({
-              name: "welfare",
+              name: "welfareInfo",
               query: { id, patientPolicyId },
             });
           },
@@ -176,7 +159,11 @@ export default {
     },
     // 修改按钮
     changeDataStatus(record) {
-      this.$set(record, "isEdit", true);
+      const { id, patientPolicyId } = record;
+      this.$router.push({
+        name: "customerEdit",
+        query: { id, patientPolicyId },
+      });
     },
     saveChange(record) {
       record.isEdit = undefined;

src/views/welfare/edit/components/benefits/index.vue

+<template>
+  <div class="benefits">
+    <div class="none-label mar-bottom10">
+      <a-button type="primary" @click="editBenefitData(null)">
+        <Icon name="ssiadd" :size="14" />新增福利
+      </a-button>
+    </div>
+    <a-table
+      :columns="columns"
+      :locale="{ emptyText: 'No Data' }"
+      :data-source="benefitData"
+      row-key="benefitCode"
+      :pagination="false"
+    >
+      <template slot="operation" slot-scope="record">
+        <a-button type="link" @click.stop="editBenefitData(record)"
+          >修改</a-button
+        >
+        <a-popconfirm
+          title="你确定要删除吗？"
+          ok-text="确定"
+          cancel-text="取消"
+          @confirm="deleteData(record)"
+        >
+          <a-button type="link" class="danger">删除</a-button>
+        </a-popconfirm>
+      </template>
+      <template slot="expandedRowRender" slot-scope="record">
+        <condition :form-data="{ ...record, conditionType: '01' }" />
+      </template>
+    </a-table>
+    <a-modal
+      title="福利管理"
+      v-model="isBenefitEditShow"
+      :footer="null"
+      width="500px"
+      @cancel="isBenefitEditShow = false"
+    >
+      <a-form-model
+        ref="editForm"
+        layout="vertical"
+        :model="editForm"
+        :rules="editRule"
+      >
+        <a-row :gutter="20">
+          <a-col :md="12">
+            <a-form-model-item label="客户公司名称" prop="corpCode">
+              <a-input disabled v-model="editForm.corpCode"> </a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :md="12">
+            <a-form-model-item label="保险计划" prop="planCode">
+              <a-input disabled v-model="editForm.planCode"> </a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :md="12">
+            <a-form-model-item label="保险责任" prop="coverageCode">
+              <a-input disabled v-model="editForm.coverageCode"> </a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :md="12">
+            <a-form-model-item label="福利项目" prop="benefitCode">
+              <a-select
+                v-model="editForm.benefitCode"
+                show-search
+                allow-clear
+                @filterOption="filterCode"
+              >
+                <a-select-option
+                  v-for="item in benefitCode"
+                  :key="item.benefitCode"
+                  :vlaue="item.benefitCode"
+                >
+                  {{ item.description }}
+                </a-select-option>
+              </a-select>
+            </a-form-model-item>
+          </a-col>
+          <a-col :md="12">
+            <a-form-model-item label="开始时间" prop="startDate">
+              <a-date-picker
+                v-model="editForm.startDate"
+                placeholder="请选择开始时间"
+                value-format="YYYY-MM-DD 00:00:00"
+              ></a-date-picker>
+            </a-form-model-item>
+          </a-col>
+          <a-col :md="12">
+            <a-form-model-item label="结束时间" prop="endDate">
+              <a-date-picker
+                v-model="editForm.endDate"
+                placeholder="请选择结束时间"
+                value-format="YYYY-MM-DD 00:00:00"
+              ></a-date-picker>
+            </a-form-model-item>
+          </a-col>
+          <a-col :md="12">
+            <a-form-model-item label="等待期">
+              <a-input-number v-model="editForm.waitingPeriod">
+              </a-input-number>
+            </a-form-model-item>
+          </a-col>
+          <a-col :md="12">
+            <a-form-model-item label="是否天数">
+              <a-input-number v-model="editForm.isdays"></a-input-number>
+            </a-form-model-item>
+          </a-col>
+          <a-col :md="12">
+            <a-form-model-item label="英文描述">
+              <a-input v-model="editForm.englishDesc"></a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :md="12">
+            <a-form-model-item label="描述">
+              <a-input v-model="editForm.loaDesc"> </a-input>
+            </a-form-model-item>
+          </a-col>
+          <!-- <a-col :md="12">
+            <a-form-model-item label="状态">
+              <a-select
+                v-model="editForm.status"
+                show-search
+                allow-clear
+                @filterOption="filterCode"
+              >
+                <a-select-option
+                  v-for="item in statusCode"
+                  :key="item.code"
+                  :vlaue="item.code"
+                >
+                  {{ item.name }}
+                </a-select-option>
+              </a-select>
+            </a-form-model-item>
+          </a-col> -->
+        </a-row>
+
+        <a-form-model-item label="备注">
+          <a-textarea
+            v-model="editForm.remarks"
+            :autoSize="{ minRows: 2, maxRows: 5 }"
+          ></a-textarea>
+        </a-form-model-item>
+        <a-form-model-item>
+          <a-button type="primary" @click="saveBenefitData">
+            <Icon name="ssiadd" :size="14" />保存
+          </a-button>
+          <a-button class="mar-left10" @click="isBenefitEditShow = false"
+            >取消
+          </a-button>
+        </a-form-model-item>
+      </a-form-model>
+    </a-modal>
+  </div>
+</template>
+
+<script>
+import condition from "../condition";
+
+export default {
+  props: {
+    formData: {
+      type: Object,
+      required: true,
+    },
+  },
+  components: {
+    condition,
+  },
+  data() {
+    const columns = [
+      { title: "责任项目明细", dataIndex: "benefitCode" },
+      // { title: "预授权申请", dataIndex: "index" },
+      { title: "更新日期", dataIndex: "modifierDate" },
+      { title: "开始日期", dataIndex: "startDate" },
+      { title: "结束日期", dataIndex: "endDate" },
+      { title: "备注", dataIndex: "remark" },
+      {
+        title: "操作",
+        key: "operation",
+        width: "175px",
+        fixed: "right",
+        scopedSlots: { customRender: "operation" },
+      },
+    ];
+    return {
+      columns,
+      isBenefitEditShow: false,
+      benefitData: [],
+      benefitCode: [],
+      editForm: {},
+      editRule: {
+        benefitCode: [{ required: true, message: "请选择福利项" }],
+        startDate: [{ required: true, message: "请选择开始时间" }],
+        endDate: [{ required: true, message: "请选择结束时间" }],
+      },
+    };
+  },
+  mounted() {
+    this._getBenefitList();
+  },
+  methods: {
+    // 选择框筛选
+    filterCode(input, option) {
+      return (
+        option.componentOptions.children[0].text
+          .toLowerCase()
+          .indexOf(input.toLowerCase()) >= 0
+      );
+    },
+    // 新增或编辑benefit数据
+    editBenefitData(data) {
+      data = data || {
+        payorCode: this.formData.payorCode,
+        corpCode: this.formData.corpCode,
+        planCode: this.formData.planCode,
+        coverageCode: this.formData.coverageCode,
+        isDirect: "N",
+        status: "1",
+      };
+      this._getBenefitCode();
+      this.editForm = this.$lodash.cloneDeep(data);
+      this.isBenefitEditShow = true;
+    },
+    deleteData(record) {
+      const data = this.$lodash.cloneDeep(record);
+      data.status = "2"; // 置为无效状态即删除
+      this._editBenefitData(data);
+    },
+    saveBenefitData() {
+      this.$refs.editForm.validate((valid) => {
+        if (!valid) {
+          return false;
+        }
+      });
+      this._editBenefitData(this.editForm);
+    },
+    _editBenefitData(data) {
+      const fn =
+        data.id || data.id === 0
+          ? this.$apis.EDITBENEFITLIST
+          : this.$apis.ADDBENEFITLIST;
+      fn(data).then((res) => {
+        if (res.returnCode === "0000") {
+          this.$message.success(res.returnMsg || "操作成功");
+          this._getBenefitList();
+          this.isBenefitEditShow = false;
+        } else {
+          this.$message.error(res.returnMsg || "操作失败");
+        }
+      });
+    },
+    _getBenefitList() {
+      const { corpCode, coverageCode, payorCode, planCode } = this.formData;
+      const data = { corpCode, coverageCode, payorCode, planCode };
+      this.$apis.GETBENEFITLIST(data).then((res) => {
+        this.benefitData = res.content || [];
+      });
+    },
+    _getBenefitCode() {
+      if (this.benefitCode && this.benefitCode.length) {
+        return true;
+      }
+      this.$apis.GETBENEGITTYPE().then((res) => {
+        this.benefitCode = res.content || [];
+      });
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.benefits {
+  .pa(0, 20, 10, 20);
+  background-color: #fff;
+}
+</style>

src/views/welfare/edit/components/condition/index.vue

+<template>
+  <div class="condition">
+    <div class="none-label mar-bottom10">
+      <a-button type="primary" @click="editConditionData(null)">
+        <Icon name="ssiadd" :size="14" />新增条件
+      </a-button>
+    </div>
+    <a-table
+      :columns="columns"
+      :locale="{ emptyText: 'No Data' }"
+      :data-source="conditionList"
+      row-key="id"
+      :pagination="false"
+    >
+      <template slot="operation" slot-scope="record">
+        <a-button type="link" @click.stop="editConditionData(record)"
+          >修改</a-button
+        >
+        <a-popconfirm
+          title="你确定要删除吗？"
+          ok-text="确定"
+          cancel-text="取消"
+          @confirm="deleteData(record)"
+        >
+          <a-button type="link" class="danger">删除</a-button>
+        </a-popconfirm>
+      </template>
+    </a-table>
+    <a-modal
+      title="条件管理"
+      v-model="isConditionEditShow"
+      :footer="null"
+      @cancel="isConditionEditShow = false"
+    >
+      <a-form-model
+        ref="editForm"
+        layout="vertical"
+        :model="editForm"
+        :rules="editRule"
+      >
+        <a-form-model-item label="频率" prop="frequencyCode">
+          <a-select
+            v-model="editForm.frequencyCode"
+            show-search
+            allow-clear
+            @filterOption="filterCode"
+          >
+            <a-select-option
+              v-for="item in frequencyCode"
+              :key="item.frequencyCode"
+              :vlaue="item.frequencyCode"
+            >
+              {{ item.frequencyDesc }}
+            </a-select-option>
+          </a-select>
+        </a-form-model-item>
+        <a-form-model-item label="条件" prop="limitCode">
+          <a-select
+            v-model="editForm.limitCode"
+            show-search
+            allow-clear
+            @filterOption="limitCode"
+          >
+            <a-select-option
+              v-for="item in limitCode"
+              :key="item.limitCode"
+              :vlaue="item.limitCode"
+            >
+              {{ item.limitDesc }}
+            </a-select-option>
+          </a-select>
+        </a-form-model-item>
+        <a-form-model-item label="开始时间" prop="startDate">
+          <a-date-picker
+            v-model="editForm.startDate"
+            placeholder="请选择开始时间"
+            value-format="YYYY-MM-DD 00:00:00"
+          ></a-date-picker>
+        </a-form-model-item>
+        <a-form-model-item label="结束时间" prop="endDate">
+          <a-date-picker
+            v-model="editForm.endDate"
+            placeholder="请选择结束时间"
+            value-format="YYYY-MM-DD 00:00:00"
+          ></a-date-picker>
+        </a-form-model-item>
+        <a-row :gutter="10">
+          <a-col :span="8">
+            <a-form-model-item label="最小值">
+              <a-input-number v-model="editForm.minValue"> </a-input-number>
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="8">
+            <a-form-model-item label="最大值">
+              <a-input-number v-model="editForm.maxValue"> </a-input-number>
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="8">
+            <a-form-model-item label="家庭最大值">
+              <a-input-number v-model="editForm.familyMaxValue">
+              </a-input-number>
+            </a-form-model-item>
+          </a-col>
+        </a-row>
+        <a-form-model-item label="币种">
+          <a-select
+            v-model="editForm.currency"
+            show-search
+            allow-clear
+            @filterOption="filterCode"
+          >
+            <a-select-option
+              v-for="item in currencyCode"
+              :key="item.code"
+              :vlaue="item.code"
+            >
+              {{ item.name }}
+            </a-select-option>
+          </a-select>
+        </a-form-model-item>
+        <!-- <a-form-model-item label="状态">
+          <a-select
+            v-model="editForm.status"
+            show-search
+            allow-clear
+            @filterOption="filterCode"
+          >
+            <a-select-option
+              v-for="item in statusCode"
+              :key="item.code"
+              :vlaue="item.code"
+            >
+              {{ item.name }}
+            </a-select-option>
+          </a-select>
+        </a-form-model-item> -->
+        <a-form-model-item label="备注" prop="remarks">
+          <a-textarea
+            v-model="editForm.remarks"
+            :autoSize="{ minRows: 2, maxRows: 5 }"
+          ></a-textarea>
+        </a-form-model-item>
+        <a-form-model-item class="text-r">
+          <a-button type="primary" @click="saveConditionData">
+            <Icon name="ssiadd" :size="14" />保存
+          </a-button>
+          <a-button class="mar-left10" @click="isConditionEditShow = false"
+            >取消
+          </a-button>
+        </a-form-model-item>
+      </a-form-model>
+    </a-modal>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    formData: {
+      type: Object,
+      required: true,
+    },
+  },
+  data() {
+    const columns = [
+      { title: "频率", dataIndex: "frequencyCode" },
+      { title: "条件", dataIndex: "limitCode" },
+      { title: "开始时间", dataIndex: "startDate" },
+      { title: "结束时间", dataIndex: "endDate" },
+      { title: "有效", dataIndex: "status" },
+      // { title: "限额或限次", dataIndex: "index" },
+      { title: "最大值", dataIndex: "maxValue" },
+      {
+        title: "操作",
+        key: "operation",
+        width: "175px",
+        fixed: "right",
+        scopedSlots: { customRender: "operation" },
+      },
+    ];
+    return {
+      columns,
+      conditionList: [],
+      isConditionEditShow: false,
+      editForm: {},
+      frequencyCode: [],
+      limitCode: [],
+      currencyCode: [
+        { code: "RMB", name: "人民币" },
+        { code: "US", name: "美金" },
+      ],
+      statusCode: [
+        { code: "1", name: "有效" },
+        { code: "2", name: "无效" },
+      ],
+      editRule: {
+        frequencyCode: [{ required: true, message: "请选择频率" }],
+        limitCode: [{ required: true, message: "请选择条件" }],
+        startDate: [{ required: true, message: "请选择开始时间" }],
+        endDate: [{ required: true, message: "请选择结束时间" }],
+      },
+    };
+  },
+  mounted() {
+    this._getConditionList();
+  },
+  methods: {
+    // 选择框筛选
+    filterCode(input, option) {
+      return (
+        option.componentOptions.children[0].text
+          .toLowerCase()
+          .indexOf(input.toLowerCase()) >= 0
+      );
+    },
+    editConditionData(data) {
+      const {
+        planCode,
+        payorCode,
+        coverageCode,
+        corpCode,
+        benefitCode,
+        conditionType,
+      } = this.formData;
+      data = data || {
+        planCode,
+        payorCode,
+        coverageCode,
+        corpCode,
+        benefitCode,
+        conditionType,
+        currency: "RMB",
+        status: "1",
+      };
+      this.editForm = this.$lodash.cloneDeep(data);
+      this._getFrequencyCode();
+      this._getLimitCode();
+      this.isConditionEditShow = true;
+    },
+    saveConditionData() {
+      this.$refs.editForm.validate((valid) => {
+        if (!valid) {
+          return false;
+        }
+        if (this.editForm.id || this.editForm.id === 0) {
+          this._editConditionData(this.editForm);
+        } else {
+          this._addConditionData(this.editForm);
+        }
+      });
+    },
+    deleteData(record) {
+      const data = this.$lodash.cloneDeep(record);
+      data.status = "2"; // 置为无效状态即删除
+      this._editConditionData(data);
+    },
+    _getConditionList() {
+      const {
+        planCode,
+        payorCode,
+        coverageCode,
+        corpCode,
+        benefitCode,
+        conditionType,
+      } = this.formData;
+      const data = {
+        planCode,
+        payorCode,
+        coverageCode,
+        corpCode,
+        benefitCode,
+        conditionType,
+      };
+      this.$apis.GETCONDITIONLIST(data).then((res) => {
+        this.conditionList = res.content || [];
+      });
+    },
+    _getFrequencyCode() {
+      if (this.frequencyCode && this.frequencyCode.length) {
+        return true;
+      }
+      this.$apis.GETFREQUENCYCODE().then((res) => {
+        this.frequencyCode = res.content || [];
+      });
+    },
+    _getLimitCode() {
+      if (this.limitCode && this.limitCode.length) {
+        return true;
+      }
+      this.$apis.GETLIMITCODE().then((res) => {
+        this.limitCode = res.content || [];
+      });
+    },
+    _addConditionData(data) {
+      this.$apis.ADDCONDITIONDATA(data).then((res) => {
+        if (res.returnCode === "0000") {
+          this._getConditionList();
+          this.$message.success(res.returnMsg || "操作成功");
+          this.isConditionEditShow = false;
+        } else {
+          this.$message.error(res.returnMsg || "操作失败");
+        }
+      });
+    },
+    _editConditionData(data) {
+      this.$apis.EDITCONDITIONDATA(data).then((res) => {
+        if (res.returnCode === "0000") {
+          this._getConditionList();
+          this.$message.success(res.returnMsg || "操作成功");
+          this.isConditionEditShow = false;
+        } else {
+          this.$message.error(res.returnMsg || "操作失败");
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.condition {
+  .pa(0, 20, 10, 20);
+  background-color: #fff;
+}
+</style>

src/views/welfare/edit/components/coverages/index.vue

+<template>
+  <div class="coverage">
+    <div class="none-label mar-bottom10">
+      <a-button type="primary" @click="editCoverageData(null)">
+        <Icon name="ssiadd" :size="14" />新增责任
+      </a-button>
+    </div>
+    <a-table
+      :columns="columns"
+      :locale="{ emptyText: 'No Data' }"
+      :data-source="coverageData"
+      row-key="coverageCode"
+      :pagination="false"
+    >
+      <template slot="operation" slot-scope="record">
+        <a-button type="link" @click.stop="editCoverageData(record)"
+          >修改</a-button
+        >
+        <a-popconfirm
+          title="你确定要删除吗？"
+          ok-text="确定"
+          cancel-text="取消"
+          @confirm="deleteData(record)"
+        >
+          <a-button type="link" class="danger">删除</a-button>
+        </a-popconfirm>
+      </template>
+      <template slot="expandedRowRender" slot-scope="record">
+        <condition
+          class="mar-bottom10"
+          :form-data="{ ...record, conditionType: '02' }"
+        />
+        <benefits :formData="record" />
+      </template>
+    </a-table>
+    <a-modal
+      title="责任管理"
+      v-model="isCoverageEditShow"
+      :footer="null"
+      width="500px"
+      @cancel="isCoverageEditShow = false"
+    >
+      <a-form-model
+        ref="editForm"
+        layout="vertical"
+        :model="editForm"
+        :rules="editRule"
+      >
+        <a-row :gutter="20">
+          <a-col :md="12">
+            <a-form-model-item label="客户公司名称" prop="corpCode">
+              <a-input disabled v-model="editForm.corpCode"> </a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :md="12">
+            <a-form-model-item label="保险计划" prop="planCode">
+              <a-input disabled v-model="editForm.planCode"> </a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :md="12">
+            <a-form-model-item label="保险责任" prop="coverageCode">
+              <a-select
+                v-model="editForm.coverageCode"
+                show-search
+                allow-clear
+                @filterOption="filterCode"
+              >
+                <a-select-option
+                  v-for="item in coverageCode"
+                  :key="item.coverageCode"
+                  :vlaue="item.coverageCode"
+                >
+                  {{ item.coverageDesc }}
+                </a-select-option>
+              </a-select>
+            </a-form-model-item>
+          </a-col>
+          <a-col :md="12">
+            <a-form-model-item label="等待期">
+              <a-input-number v-model="editForm.waitingPeriod">
+              </a-input-number>
+            </a-form-model-item>
+          </a-col>
+          <a-col :md="12">
+            <a-form-model-item label="英文描述">
+              <a-input v-model="editForm.englishDesc"></a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :md="12">
+            <a-form-model-item label="描述">
+              <a-input v-model="editForm.loaDesc"> </a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :md="12">
+            <a-form-model-item label="是否直付">
+              <a-radio-group
+                v-model="editForm.isDirect"
+                :default-value="editForm.isDirect"
+                button-style="solid"
+              >
+                <a-radio-button value="Y"> 是 </a-radio-button>
+                <a-radio-button class="mar-left10" value="N">
+                  否
+                </a-radio-button>
+              </a-radio-group>
+            </a-form-model-item>
+          </a-col>
+          <!-- <a-col :md="12">
+            <a-form-model-item label="状态">
+              <a-select
+                v-model="editForm.status"
+                show-search
+                allow-clear
+                @filterOption="filterCode"
+              >
+                <a-select-option
+                  v-for="item in statusCode"
+                  :key="item.code"
+                  :vlaue="item.code"
+                >
+                  {{ item.name }}
+                </a-select-option>
+              </a-select>
+            </a-form-model-item>
+          </a-col> -->
+        </a-row>
+        <!-- <a-form-model-item label="保险公司" prop="payorCode">
+          <a-input disabled v-model="editForm.payorCode"> </a-input>
+        </a-form-model-item> -->
+
+        <a-form-model-item label="备注">
+          <a-textarea
+            v-model="editForm.remarks"
+            :autoSize="{ minRows: 2, maxRows: 5 }"
+          ></a-textarea>
+        </a-form-model-item>
+        <a-form-model-item>
+          <a-button type="primary" @click="saveCoverageData">
+            <Icon name="ssiadd" :size="14" />保存
+          </a-button>
+          <a-button class="mar-left10" @click="isCoverageEditShow = false"
+            >取消
+          </a-button>
+        </a-form-model-item>
+      </a-form-model>
+    </a-modal>
+  </div>
+</template>
+
+<script>
+import benefits from "../benefits";
+import condition from "../condition";
+
+export default {
+  props: {
+    formData: {
+      required: true,
+      type: Object,
+    },
+  },
+  components: {
+    benefits,
+    condition,
+  },
+  data() {
+    const columns = [
+      { title: "门诊责任", dataIndex: "coverageCode", width: 150 },
+      { title: "是否直付", dataIndex: "isDirect", width: 120 },
+      { title: "等待期", dataIndex: "waitingPeriod", width: 120 },
+      // { title: "预授权", dataIndex: "sex", width: 80 },
+      // { title: "预授权期限", dataIndex: "payorName", width: 180 },
+      { title: "状态", dataIndex: "status", width: 180 },
+      { title: "备注", dataIndex: "remark" },
+      {
+        title: "操作",
+        key: "operation",
+        width: "175px",
+        fixed: "right",
+        scopedSlots: { customRender: "operation" },
+      },
+    ];
+    return {
+      isCoverageEditShow: false,
+      columns,
+      coverageData: [],
+      editForm: {},
+      coverageCode: [],
+      statusCode: [
+        { code: "1", name: "有效" },
+        { code: "2", name: "无效" },
+      ],
+      editRule: {
+        coverageCode: [{ required: true, message: "请选择保险责任" }],
+      },
+    };
+  },
+  mounted() {
+    this._getCoverageList();
+  },
+  methods: {
+    // 新增或编辑coverage数据
+    editCoverageData(data) {
+      data = data || {
+        payorCode: this.formData.payorCode,
+        corpCode: this.formData.corpCode,
+        planCode: this.formData.planCode,
+        isDirect: "N",
+        status: "1",
+      };
+      this._getCoverageCode();
+      this.editForm = this.$lodash.cloneDeep(data);
+      this.isCoverageEditShow = true;
+    },
+    // 选择框筛选
+    filterCode(input, option) {
+      return (
+        option.componentOptions.children[0].text
+          .toLowerCase()
+          .indexOf(input.toLowerCase()) >= 0
+      );
+    },
+    saveCoverageData() {
+      this.$refs.editForm.validate((valid) => {
+        if (!valid) {
+          return false;
+        }
+        this._editCoverageData(this.editForm);
+      });
+    },
+    deleteData(record) {
+      const data = this.$lodash.cloneDeep(record);
+      data.status = "2"; // 置为无效状态即删除
+      this._editCoverageData(data);
+    },
+    _editCoverageData(data) {
+      const fn =
+        data.id || data.id === 0
+          ? this.$apis.EDITCOVERAGEDATA
+          : this.$apis.ADDCOVERAGEDATA;
+      fn(data).then((res) => {
+        if (res.returnCode === "0000") {
+          this.$message.success(res.returnMsg || "操作成功");
+          this._getCoverageList();
+          this.isCoverageEditShow = false;
+        } else {
+          this.$message.error(res.returnMsg || "操作失败");
+        }
+      });
+    },
+    _getCoverageCode() {
+      if (this.coverageCode && this.coverageCode.length) {
+        return true;
+      }
+      this.$apis.GETCOVERAGECODE().then((res) => {
+        this.coverageCode = res.content || [];
+      });
+    },
+    _getCoverageList() {
+      const { corpCode, payorCode, planCode } = this.formData;
+      this.$apis
+        .GETCOVERAGELIST({
+          corpCode,
+          payorCode,
+          planCode,
+          specialtyCode: "",
+        })
+        .then((res) => {
+          this.coverageData = res.content || [];
+        });
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.coverage {
+  .pa(0, 20, 10, 20);
+  background-color: #fff;
+}
+</style>

src/views/welfare/edit/index.vue

+<template>
+  <div class="welfare">
+    <!-- form -->
+    <a-form-model ref="form" layout="vertical" :model="form" :rules="formRules">
+      <a-row :gutter="30">
+        <a-col :xl="5" :lg="6" :sm="12">
+          <a-form-model-item label="保险公司" prop="payorCode">
+            <a-select
+              v-model="form.payorCode"
+              placeholder="请选择保险公司"
+              show-search
+              allow-clear
+              @change="payorChange"
+              @filterOption="filterCode"
+            >
+              <a-select-option
+                v-for="item in companyCode"
+                :key="item.payorCode"
+                :value="item.payorCode"
+              >
+                {{ item.longName }}
+              </a-select-option>
+            </a-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="5" :lg="6" :sm="12">
+          <a-form-model-item label="客户公司名称" prop="corpCode">
+            <a-select
+              v-model="form.corpCode"
+              placeholder="请选择客户公司名称"
+              show-search
+              allow-clear
+              @filterOption="filterCode"
+              @change="corpChange"
+            >
+              <a-select-option
+                v-for="item in corpCode"
+                :key="item.corpCode"
+                :value="item.corpCode"
+              >
+                {{ item.longName }}
+              </a-select-option>
+            </a-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="5" :lg="6" :sm="12">
+          <a-form-model-item label="保险计划" prop="planCode">
+            <a-select
+              v-model="form.planCode"
+              placeholder="请选择保险计划"
+              show-search
+              allow-clear
+              @filterOption="filterCode"
+            >
+              <a-select-option
+                v-for="item in planCode"
+                :key="item.planCode"
+                :vlaue="item.planCode"
+              >
+                {{ item.longName }}
+              </a-select-option>
+            </a-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="9" :lg="6" :sm="12" class="none-label">
+          <a-form-model-item label="button">
+            <a-button type="primary" class="mar-left10" @click="handlerSearch"
+              ><Icon name="ssisearch_active" :size="14" />查询
+            </a-button>
+          </a-form-model-item>
+        </a-col>
+      </a-row>
+    </a-form-model>
+    <div>
+      <!-- <div class="none-label mar-bottom10">
+        <a-button type="primary" @click="editPlanData(null)">
+          <Icon name="ssiadd" :size="14" />新增计划
+        </a-button>
+      </div> -->
+      <a-table
+        :columns="columns"
+        :locale="{ emptyText: 'No Data' }"
+        :data-source="planData"
+        row-key="coverageCode"
+        :pagination="false"
+      >
+        <template slot="operation" slot-scope="record">
+          <a-button type="link" @click.stop="editPlanData(record)"
+            >修改</a-button
+          >
+          <!-- <a-popconfirm
+            title="你确定要删除吗？"
+            ok-text="确定"
+            cancel-text="取消"
+            @confirm="deleteData"
+          >
+            <a-button type="link" class="danger">删除</a-button>
+          </a-popconfirm> -->
+        </template>
+        <template slot="expandedRowRender" slot-scope="record">
+          <condition
+            class="mar-bottom10"
+            :form-data="{
+              ...record,
+              conditionType: '03',
+            }"
+          />
+          <coverages :formData="{ ...record }" />
+        </template>
+      </a-table>
+      <BurtPagination
+        :pagination="{ ...pager, total }"
+        @pageChange="pageChange"
+      />
+    </div>
+    <a-modal
+      title="计划管理"
+      v-model="isPlanEditShow"
+      :footer="null"
+      @cancel="isPlanEditShow = false"
+    >
+      <a-form-model
+        ref="editForm"
+        layout="vertical"
+        :model="editForm"
+        :rules="editRule"
+      >
+        <!-- <a-form-model-item label="保险公司" prop="payorCode">
+          <a-input disabled v-model="editForm.payorCode"> </a-input>
+        </a-form-model-item>
+        <a-form-model-item label="客户公司名称" prop="corpCode">
+          <a-input disabled v-model="editForm.corpCode"> </a-input>
+        </a-form-model-item> -->
+        <a-form-model-item label="保险计划" prop="planCode">
+          <a-input v-model="editForm.planCode"></a-input>
+        </a-form-model-item>
+        <a-form-model-item label="计划全称" prop="longName">
+          <a-input v-model="editForm.longName"></a-input>
+        </a-form-model-item>
+        <a-form-model-item label="计划简称" prop="shortName">
+          <a-input v-model="editForm.shortName"></a-input>
+        </a-form-model-item>
+        <a-form-model-item label="英文名称" prop="englishName">
+          <a-input v-model="editForm.englishName"></a-input>
+        </a-form-model-item>
+        <a-form-model-item label="生效日期" prop="effectiveDate">
+          <a-date-picker
+            v-model="editForm.effectiveDate"
+            placeholder="请选择生效日期"
+            value-format="YYYY-MM-DD 00:00:00"
+          ></a-date-picker>
+        </a-form-model-item>
+        <a-form-model-item label="失效日期" prop="terminationDate">
+          <a-date-picker
+            v-model="editForm.terminationDate"
+            placeholder="请选择失效日期"
+            value-format="YYYY-MM-DD 00:00:00"
+          ></a-date-picker>
+        </a-form-model-item>
+        <a-form-model-item label="等待期(天)" prop="waitingPeriod">
+          <a-input-number v-model="editForm.waitingPeriod"></a-input-number>
+        </a-form-model-item>
+        <a-form-model-item label="备注" prop="remarks">
+          <a-textarea
+            v-model="editForm.remarks"
+            :autoSize="{ minRows: 2, maxRows: 5 }"
+          ></a-textarea>
+        </a-form-model-item>
+        <a-form-model-item class="text-r">
+          <a-button type="primary" @click="savePlanData">
+            <Icon name="ssiadd" :size="14" />保存
+          </a-button>
+          <a-button class="mar-left10" @click="isPlanEditShow = false"
+            >取消
+          </a-button>
+        </a-form-model-item>
+      </a-form-model>
+    </a-modal>
+  </div>
+</template>
+
+<script>
+import BurtPagination from "@/components/CUSTOMER/pagation";
+import condition from "./components/condition";
+import coverages from "./components/coverages";
+export default {
+  components: {
+    BurtPagination,
+    condition,
+    coverages,
+  },
+  data() {
+    const columns = [
+      { title: "计划责任", dataIndex: "planCode", width: 180 },
+      { title: "全称", dataIndex: "longName", width: 180 },
+      { title: "简称", dataIndex: "shortName", width: 180 },
+      { title: "起始日期", dataIndex: "effectiveDate", width: 180 },
+      { title: "终止日期", dataIndex: "terminationDate", width: 180 },
+      { title: "计划状态", dataIndex: "status", width: 180 },
+      { title: "等待期", dataIndex: "waitingPeriod" },
+      { title: "备注", dataIndex: "remarks" },
+      {
+        title: "操作",
+        key: "operation",
+        width: "175px",
+        fixed: "right",
+        scopedSlots: { customRender: "operation" },
+      },
+      //   { title: "保单号码", dataIndex: "policyNo", width: 190 },
+      //   { title: "保险有效日期", dataIndex: "startDate", width: 180 },
+      //   { title: "保险终止日期", dataIndex: "endDate", width: 180 },
+    ];
+    return {
+      isPlanEditShow: false,
+      columns,
+      form: {
+        payorCode: undefined,
+        corpCode: undefined,
+        planCode: undefined,
+      },
+      searchForm: {},
+      detailForm: {},
+      editForm: {},
+      planData: [],
+      companyCode: [],
+      corpCode: [],
+      planCode: [],
+      queryForm: {},
+      pager: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+      total: 0,
+      formRules: {
+        payorCode: [{ required: true, message: "请选择保险公司" }],
+        corpCode: [{ required: true, message: "请选择客户公司名称" }],
+        // planCode: [{ required: true, message: "请选择保险计划" }],
+      },
+      editRule: {
+        planCode: [{ required: true, message: "请输入保险计划内容" }],
+        longName: [{ required: true, message: "请输入保险计划全称" }],
+        shortName: [{ required: true, message: "请输入保险计划简称" }],
+        effectiveDate: [{ required: true, message: "请选择生效日期" }],
+        terminationDate: [{ required: true, message: "请选择失效日期" }],
+      },
+    };
+  },
+  mounted() {
+    if (this.$route.query && this.$route.query.id) {
+      this.detailForm = this.$route.query;
+    }
+    this._getPayorCode();
+  },
+  methods: {
+    handlerSearch() {
+      this.$refs.form.validate((valid) => {
+        if (!valid) {
+          return false;
+        }
+        this.searchForm = this.$lodash.cloneDeep(this.form);
+        this.pager.pageNum = 1;
+        this._getPlanList();
+      });
+    },
+    pageChange(page) {
+      const { pageNum } = page;
+      this.pager.pageNum = pageNum;
+      this._getPlanList();
+    },
+    payorChange(val) {
+      this.form.corpCode = undefined;
+      this.form.planCode = undefined;
+      if (!val) {
+        return false;
+      }
+      this._getCorporateCode(val);
+    },
+    corpChange(val) {
+      this.form.planCode = undefined;
+      if (!val) {
+        return false;
+      }
+      this._getPlanCode(val);
+    },
+    // 选择框筛选
+    filterCode(input, option) {
+      return (
+        option.componentOptions.children[0].text
+          .toLowerCase()
+          .indexOf(input.toLowerCase()) >= 0
+      );
+    },
+    deleteData(record) {
+      const data = this.$lodash.cloneDeep(record);
+      data.status = "2"; // 置为无效状态即删除
+      this._editPlanData(data);
+    },
+    editPlanData(data) {
+      if (data) {
+        this.editForm = this.$lodash.cloneDeep(data);
+        this.isPlanEditShow = true;
+      } else {
+        this.$refs.form.validateField(["payorCode", "corpCode"], (error) => {
+          if (error) {
+            return false;
+          }
+          data = {
+            payorCode: this.form.payorCode,
+            corpCode: this.form.corpCode,
+          };
+          this.editForm = this.$lodash.cloneDeep(data);
+          this.isPlanEditShow = true;
+        });
+      }
+      //   data = data || {};
+    },
+    savePlanData() {
+      this.$refs.editForm.validate((valid) => {
+        if (!valid) {
+          return false;
+        }
+        this._editPlanData(this.editForm);
+      });
+    },
+    _editPlanData(data) {
+      this.$apis.EDITPLANDATE(data).then((res) => {
+        if (res.returnCode === "0000") {
+          this._getPlanList();
+          this.$message.success(res.returnMsg || "操作成功");
+          this.isPlanEditShow = false;
+        } else {
+          this.$message.error(res.returnMsg || "操作失败");
+        }
+      });
+    },
+    _getPayorCode() {
+      this.$apis.GETPAYORCODE({}).then((res) => {
+        this.companyCode = res.content || [];
+      });
+    },
+    _getCorporateCode(val) {
+      this.$apis
+        .GETCORPORATECODEBYPAYOR({
+          longName: "",
+          payorCode: val,
+        })
+        .then((res) => {
+          this.corpCode = res.content || [];
+        });
+    },
+    _getPlanCode(val) {
+      this.$apis
+        .GETPLANCODEBYCORP({
+          longName: "",
+          corpCode: val,
+        })
+        .then((res) => {
+          this.planCode = res.content || [];
+        });
+    },
+    _getPlanList() {
+      const data = {
+        ...this.searchForm,
+        ...this.pager,
+      };
+      this.$apis.GETPLANLIST(data).then((res) => {
+        this.planData = (res.content && res.content.list) || [];
+        this.total = (res.content && res.content.total) || 0;
+      });
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.welfare {
+  .pa(30, 36, 50, 39);
+  background-color: #fff;
+  .none-label {
+    text-align: right;
+  }
+  .classify {
+    .pa(10, 20, 10, 20);
+    .mg-t(10);
+    .mg-b(10);
+    background-color: #f8fafb;
+    .ant-btn:not(:first-child) {
+      .mg-l(30);
+    }
+    .save-btn {
+      float: right;
+    }
+  }
+  .icon-class {
+    .mg-r(10);
+  }
+}
+</style>

src/views/welfare/index.vue

 <template>
-  <div class="welfare">
-    <!-- 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="客户姓名" prop="patientName">
-            <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="出生日期" prop="birthday">
-            <a-date-picker
-              v-model="form.birthday"
-              placeholder="请选择出生日期"
-              value-format="YYYY-MM-DD"
-            ></a-date-picker>
-          </a-form-model-item>
-        </a-col>
-        <a-col :xl="4" :lg="6" :sm="12">
-          <a-form-model-item label="保险公司" prop="payorId">
-            <a-select
-              v-model="form.payorId"
-              placeholder="请选择保险公司"
-              show-search
-              allow-clear
-              @change="payorChange"
-              @filterOption="filterCode"
-            >
-              <a-select-option
-                v-for="item in companyCode"
-                :key="item.id"
-                :value="item.id"
-              >
-                {{ item.longName }}
-              </a-select-option>
-            </a-select>
-          </a-form-model-item>
-        </a-col>
-        <a-col :xl="7" :lg="6" :sm="12">
-          <a-form-model-item label="客户公司名称" prop="corpName">
-            <a-select
-              v-model="form.corpName"
-              placeholder="请选择客户公司名称"
-              show-search
-              allow-clear
-              @filterOption="filterCode"
-              @change="corpChange"
-            >
-              <a-select-option
-                v-for="item in corpCode"
-                :key="item.id"
-                :value="item.id + '$_' + item.longName"
-              >
-                {{ item.longName }}
-              </a-select-option>
-            </a-select>
-          </a-form-model-item>
-        </a-col>
-        <a-col :xl="6" :lg="6" :sm="12">
-          <a-form-model-item label="保单卡号" prop="policyNo">
-            <a-input
-              v-model="form.policyNo"
-              allow-clear
-              placeholder="请输入保单卡号"
-            ></a-input>
-          </a-form-model-item>
-        </a-col>
-        <a-col :xl="4" :lg="6" :sm="12">
-          <a-form-model-item label="首次入保时间" prop="firstEnrollmentTime">
-            <a-date-picker
-              v-model="form.firstEnrollmentTime"
-              placeholder="请选择首次入保时间"
-              value-format="YYYY-MM-DD"
-            ></a-date-picker>
-          </a-form-model-item>
-        </a-col>
-        <a-col :xl="4" :lg="6" :sm="12">
-          <a-form-model-item label="保单生效日期" prop="startDate">
-            <a-date-picker
-              v-model="form.startDate"
-              placeholder="请选择保单生效日期"
-              value-format="YYYY-MM-DD"
-            ></a-date-picker>
-          </a-form-model-item>
-        </a-col>
-        <a-col :xl="4" :lg="6" :sm="12">
-          <a-form-model-item label="保单终止日期" prop="endDate">
-            <a-date-picker
-              v-model="form.endDate"
-              placeholder="请选择保单终止日期"
-              value-format="YYYY-MM-DD"
-            ></a-date-picker>
-          </a-form-model-item>
-        </a-col>
-        <a-col :xl="6" :lg="6" :sm="12">
-          <a-form-model-item label="保险计划" prop="planName">
-            <a-select
-              v-model="form.planName"
-              placeholder="请选择保险计划"
-              show-search
-              allow-clear
-              @filterOption="filterCode"
-            >
-              <a-select-option
-                v-for="item in planCode"
-                :key="item.id"
-                :vlaue="item.longName"
-              >
-                {{ item.longName }}
-              </a-select-option>
-            </a-select>
-          </a-form-model-item>
-        </a-col>
-        <a-col :xl="6" :lg="6" :sm="12">
-          <a-form-model-item label="其他备注" prop="remark">
-            <a-input
-              v-model="form.remark"
-              allow-clear
-              placeholder="请输入备注信息"
-            ></a-input>
-          </a-form-model-item>
-        </a-col>
-        <a-col :xl="4" :lg="6" :sm="12">
-          <a-form-model-item label="等待期" prop="waitingPeriod">
-            <a-radio-group
-              v-model="form.waitingPeriod"
-              :default-value="form.waitingPeriod"
-              button-style="solid"
-            >
-              <a-radio-button value="Y"> 是 </a-radio-button>
-              <a-radio-button class="mar-left10" value="N"> 否 </a-radio-button>
-            </a-radio-group>
-          </a-form-model-item>
-        </a-col>
-        <a-col :xl="4" :lg="6" :sm="12">
-          <a-form-model-item label="等待期时间" prop="waitingPeriodTime">
-            <a-date-picker
-              v-model="form.waitingPeriodTime"
-              placeholder="请选择等待期时间"
-              value-format="YYYY-MM-DD"
-            ></a-date-picker>
-          </a-form-model-item>
-        </a-col>
-        <a-col :xl="4" :lg="6" :sm="12">
-          <a-form-model-item label="是否承担既往症" prop="isUndertakeAnamnesis">
-            <a-radio-group
-              v-model="form.isUndertakeAnamnesis"
-              :default-value="form.isUndertakeAnamnesis"
-              button-style="solid"
-            >
-              <a-radio-button value="Y"> 是 </a-radio-button>
-              <a-radio-button class="mar-left10" value="N"> 否 </a-radio-button>
-            </a-radio-group>
-          </a-form-model-item>
-        </a-col>
-        <a-col :xl="6" :lg="18" :sm="12" class="none-label">
-          <a-form-model-item label="button">
-            <a-button type="primary" class="text-r" @click="handlerReset">
-              <Icon name="ssireset" :size="14" />重置
-            </a-button>
-            <a-button type="primary" class="mar-left10" @click="handlerSearch"
-              ><Icon name="ssisearch_active" :size="14" />查询
-            </a-button>
-          </a-form-model-item>
-        </a-col>
-      </a-row>
-    </a-form-model>
-    <a-table
-      v-if="customList && customList.length"
-      :columns="customColumns"
-      :data-source="customList"
-      row-key="mrnNo"
-      :scroll="{ x: true }"
-      :pagination="cusPagination"
-      :customRow="handlerRowClick"
-      @change="onCustomChange"
-    ></a-table>
-    <coverages
-      :coverageForm="coverageForm"
-      v-if="isShowCoverageData"
-    ></coverages>
+  <div class="index">
+    <router-view></router-view>
   </div>
 </template>
 
 <script>
-import coverages from "./components/coverages";
 export default {
-  components: {
-    coverages,
-  },
   data() {
-    const customColumns = [
-      { title: "病历号", dataIndex: "mrnNo", width: 180 },
-      { title: "客户姓名", dataIndex: "patientName", width: 120 },
-      { title: "出生日期", dataIndex: "birthday", width: 180 },
-      { title: "性别", dataIndex: "sex", width: 80 },
-      { title: "保险公司", dataIndex: "payorName", width: 180 },
-      { title: "保单号码", dataIndex: "policyNo", width: 190 },
-      { title: "保险有效日期", dataIndex: "startDate", width: 180 },
-      { title: "保险终止日期", dataIndex: "endDate", width: 180 },
-    ];
-    return {
-      isShowCoverageData: false,
-      customColumns,
-      form: {
-        patientName: undefined,
-        payorId: undefined,
-        corpName: undefined,
-        planName: undefined,
-        birthday: undefined,
-        policyNo: undefined,
-        firstEnrollmentTime: undefined,
-        startDate: undefined,
-        endDate: undefined,
-        remark: undefined,
-        waitingPeriod: "N",
-        isUndertakeAnamnesis: "N",
-      },
-      detailForm: {},
-      coverageForm: {},
-      customList: [],
-      companyCode: [],
-      corpCode: [],
-      planCode: [],
-      queryForm: {},
-      cusPager: {
-        pageNum: 1,
-        pageSize: 10,
-      },
-      cusTotal: 0,
-    };
-  },
-  computed: {
-    cusPagination() {
-      return this.initPageConfig(
-        { ...this.cusPager, total: this.cusTotal },
-        this.onCustomSizeChange
-      );
-    },
-  },
-  mounted() {
-    if (this.$route.query && this.$route.query.id) {
-      console.log(this.$route);
-      this.detailForm = this.$route.query;
-      this.getCustomerDetail();
-    }
-    this._getPayorCode();
-  },
-  methods: {
-    initPageConfig(pager, sizeChange) {
-      const { pageNum, pageSize, total } = pager;
-      const pages = Math.ceil(total / pageSize);
-      return {
-        current: pageNum,
-        pageSize,
-        size: "large",
-        position: "bottom",
-        align: "right",
-        total: this.total,
-        hideOnSinglePage: false,
-        itemRender: (current, type, originalElement) => {
-          if (type === "prev") {
-            originalElement.children = undefined;
-            originalElement.text = "上一页";
-          }
-          if (type === "page") {
-            if (current !== pageNum) {
-              return undefined;
-            }
-            return (
-              <p>
-                <span class="current-page">{current}</span> / {pages}
-              </p>
-            );
-          }
-          if (type === "next") {
-            originalElement.children = undefined;
-            originalElement.text = "下一页";
-            return (
-              <div>
-                {originalElement}
-                <a-input-number
-                  onblur={sizeChange}
-                  class="size-change"
-                ></a-input-number>
-              </div>
-            );
-          }
-          return originalElement;
-        },
-      };
-    },
-    onCustomChange(pager) {
-      const { current } = pager;
-      // console.log(pager);
-      this.cusPager.pageNum = current;
-      this._getCustomerList();
-    },
-    onCustomSizeChange(e) {
-      e && e.stopPropagation();
-      const val = e.target.value * 1;
-      if (!val || val < 0) {
-        return false;
-      }
-      this.cusPager.pageSize = val;
-      this._getCustomerList();
-    },
-    handlerRowClick(record) {
-      const { id, patientPolicyId } = record;
-      return {
-        on: {
-          click: () => {
-            this.detailForm = { id, patientPolicyId };
-            this.getCustomerDetail();
-          },
-        },
-      };
-    },
-    getCustomerDetail() {
-      // this.queryForm = this.$lodash.cloneDeep(this.form);
-      const { id, patientPolicyId } = this.detailForm;
-      const data = {
-        id: id && id * 1,
-        patientPolicyId: patientPolicyId * 1,
-      };
-      this.$apis.GETCUSTOMERDETAIL(data).then((res) => {
-        if (res.returnCode === "0000") {
-          const data = res.content || {};
-          for (let i in this.form) {
-            this.form[i] = data[i];
-          }
-          this.coverageForm = res.content || {};
-          this.isShowCoverageData = true;
-        }
-        // this.dataList = (res.content && res.content.list) || [];
-        // this.total = (res.content && res.content.total) || 0;
-      });
-    },
-    handlerReset() {
-      this.$refs.form.resetFields();
-    },
-    handlerSearch() {
-      console.log(this.$refs.form.validate);
-      this.$refs.form.validate((valid) => {
-        if (!valid) {
-          return false;
-        }
-        this.cusPager.pageNum = 1;
-        this.queryForm = this.$lodash.cloneDeep(this.form);
-        this._getCustomerList();
-      });
-    },
-    payorChange(val) {
-      this.form.corpName = undefined;
-      this.form.planName = undefined;
-      if (!val) {
-        return false;
-      }
-      this._getCorporateCode(val);
-    },
-    corpChange(val) {
-      // 因为接口要name  但是查计划要用id
-      this.form.planName = undefined;
-      if (!val) {
-        return false;
-      }
-      console.log(val);
-      this.form.corpName = val.split("$_")[1];
-      val = val.split("$_")[0];
-      this._getPlanCode(val);
-    },
-    // 选择框筛选
-    filterCode(input, option) {
-      return (
-        option.componentOptions.children[0].text
-          .toLowerCase()
-          .indexOf(input.toLowerCase()) >= 0
-      );
-    },
-    _getPayorCode() {
-      this.$apis.GETPAYORCODE({}).then((res) => {
-        this.companyCode = res.content || [];
-      });
-    },
-    _getCorporateCode(val) {
-      this.$apis
-        .GETCORPORATECODEBYPAYOR({
-          longName: "",
-          payorId: val,
-        })
-        .then((res) => {
-          this.corpCode = res.content || [];
-        });
-    },
-    _getPlanCode(val) {
-      this.$apis
-        .GETPLANCODEBYCORP({
-          longName: "",
-          corpId: val,
-        })
-        .then((res) => {
-          this.planCode = res.content || [];
-        });
-    },
-    _getCustomerList() {
-      const data = {
-        ...this.queryForm,
-        ...this.cusPager,
-      };
-      this.$apis.GETCUSTOMERLIST(data).then((res) => {
-        this.customList = (res.content && res.content.list) || [];
-        this.cusTotal = (res.content && res.content.total) || 0;
-      });
-    },
+    return {};
   },
+  computed: {},
+  watch: {},
+  methods: {},
 };
 </script>
 
-<style lang="less" scoped>
-.welfare {
-  .pa(30, 36, 50, 39);
-  background-color: #fff;
-  .none-label {
-    text-align: right;
-  }
-  .classify {
-    .pa(10, 20, 10, 20);
-    .mg-t(10);
-    .mg-b(10);
-    background-color: #f8fafb;
-    .ant-btn:not(:first-child) {
-      .mg-l(30);
-    }
-    .save-btn {
-      float: right;
-    }
-  }
-  .icon-class {
-    .mg-r(10);
-  }
-}
-</style>
+<style lang="less" scoped></style>

src/views/welfare/info/components/PolicyInfo.vue

+<template>
+  <div>
+    <a-collapse
+      v-model="activeKeys"
+      expand-icon-position="right"
+      :bordered="false"
+    >
+      <a-collapse-panel key="1" header="保单信息">
+        <a-row class="policy_line" :gutter="10">
+          <a-col :span="6">被保险人：</a-col>
+          <a-col :span="6">主被保险人：</a-col>
+          <a-col :span="6">保险卡号：</a-col>
+          <a-col :span="6">保单年有效期：</a-col>
+        </a-row>
+        <a-row class="policy_line" :gutter="10">
+          <a-col :span="6">保单号：</a-col>
+          <a-col :span="6">首保日期：</a-col>
+          <a-col :span="6">保单直付区域：</a-col>
+        </a-row>
+        <a-row class="policy_line" :gutter="10">
+          <a-col :span="6">证件号：</a-col>
+          <a-col :span="6">出生日期：</a-col>
+          <a-col :span="6">性别：</a-col>
+          <a-col :span="6">年龄：</a-col>
+        </a-row>
+        <a-row class="policy_line" :gutter="10">
+          <a-col :span="6">公司：</a-col>
+          <a-col :span="6">会员标识：</a-col>
+        </a-row>
+      </a-collapse-panel>
+    </a-collapse>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    policyData: {
+      default: {},
+    },
+  },
+  data() {
+    return {
+      activeKeys: "1",
+    };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.policy_line {
+  .pa(0, 30, 0, 30);
+  line-height: 60px;
+  //   &:not(:last-child) {
+  border-bottom: 1px solid #f8fafb;
+  //   }
+}
+</style>

src/views/welfare/components/benefits/index.vue → src/views/welfare/info/components/benefits/index.vue

 <template>
   <div class="benefits">
-    <div>
-      <div class="text-r">
-        <a-button type="danger" class="save-btn">
-          <Icon name="ssiadd" :size="14" />新增
-        </a-button>
-        <a-table
-          :pagination="false"
-          :columns="considtionColumns"
-          :data-source="conditionData"
-        >
-          <template slot="operation" slot-scope="text, record">
-            <a-button v-if="record.isEdit" type="link"> 保存 </a-button>
-            <a-button v-else type="link"> 修改 </a-button>
-            <a-button type="link" class="success">新增</a-button>
-            <a-popconfirm
-              title="你确定要关闭吗？"
-              ok-text="确定"
-              cancel-text="取消"
-            >
-              <a-button type="link" class="danger">删除</a-button>
-            </a-popconfirm>
-          </template>
-        </a-table>
-      </div>
-    </div>
-    <div>
+    <!-- <div>
       <div class="text-r">
         <a-button type="danger" class="save-btn">
           <Icon name="ssiadd" :size="14" />新增
@@ -49,47 +24,62 @@
           </template>
         </a-table>
       </div>
-    </div>
+    </div> -->
+    <a-collapse
+      v-model="activeKeys"
+      expand-icon-position="right"
+      :bordered="false"
+    >
+      <a-collapse-panel
+        v-for="item in benefitData"
+        :key="item.benefitCode"
+        :header="item.benefitCode"
+      >
+        <div>
+          <a-row class="policy_line" :gutter="10">
+            <a-col :span="6">事先授权：</a-col>
+            <a-col :span="6">等待期：{{ item.waitingPeriod }}</a-col>
+            <a-col :span="6">年限额：</a-col>
+            <a-col :span="6">赔付比例：</a-col>
+          </a-row>
+        </div>
+        <condition :formData="{ ...item, conditionType: '01' }" />
+      </a-collapse-panel>
+    </a-collapse>
   </div>
 </template>
 
 <script>
+import condition from "../condition";
+
 export default {
   props: {
-    coverageForm: {
+    formData: {
       type: Object,
       required: true,
     },
   },
+  components: {
+    condition,
+  },
   data() {
-    const considtionColumns = [
-      { title: "限额", dataIndex: "index" },
-      {
-        title: "操作",
-        key: "operation",
-        width: "175px",
-        fixed: "right",
-        scopedSlots: { customRender: "operation" },
-      },
-    ];
-    const benefitColumns = [
-      { title: "责任列表", dataIndex: "index" },
-      {
-        title: "操作",
-        key: "operation",
-        width: "175px",
-        fixed: "right",
-        scopedSlots: { customRender: "operation" },
-      },
-    ];
     return {
-      considtionColumns,
-      benefitColumns,
-      conditionData: [{ index: "900" }],
-      benefitData: [{ index: "测试" }],
+      benefitData: [],
+      activeKeys: "",
     };
   },
-  methods: {},
+  mounted() {
+    this._getBenefitData();
+  },
+  methods: {
+    _getBenefitData() {
+      const { corpCode, coverageCode, payorCode, planCode } = this.formData;
+      const data = { corpCode, coverageCode, payorCode, planCode };
+      this.$apis.GETBENEFITLIST(data).then((res) => {
+        this.benefitData = res.content || [];
+      });
+    },
+  },
 };
 </script>
 
@@ -105,4 +95,11 @@ export default {
     }
   }
 }
+.policy_line {
+  .pa(0, 30, 0, 30);
+  line-height: 60px;
+  //   &:not(:last-child) {
+  border-bottom: 1px solid #f8fafb;
+  //   }
+}
 </style>

src/views/welfare/info/components/condition/index.vue

+<template>
+  <div>
+    <a-table
+      class="mar-bottom10"
+      :columns="columns"
+      :locale="{ emptyText: 'No Data' }"
+      :data-source="conditionList"
+      row-key="mrnNo"
+      :pagination="false"
+    ></a-table>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    formData: {
+      default: {},
+    },
+  },
+  data() {
+    const columns = [
+      { title: "频率", dataIndex: "frequencyCode" },
+      { title: "条件", dataIndex: "limitCode" },
+      { title: "最小值", dataIndex: "minValue" },
+      { title: "最大值", dataIndex: "maxValue" },
+      { title: "家庭最大值", dataIndex: "familyMaxValue" },
+      {
+        title: "操作",
+        key: "operation",
+        width: "175px",
+        fixed: "right",
+        scopedSlots: { customRender: "operation" },
+      },
+    ];
+    return {
+      columns,
+      conditionList: [],
+    };
+  },
+  mounted() {
+    this._getConditionList();
+  },
+  methods: {
+    _getConditionList() {
+      const {
+        planCode,
+        payorCode,
+        coverageCode,
+        corpCode,
+        benefitCode,
+        conditionType,
+      } = this.formData;
+      const data = {
+        planCode,
+        payorCode,
+        coverageCode,
+        corpCode,
+        benefitCode,
+        conditionType,
+      };
+      this.$apis.GETCONDITIONLIST(data).then((res) => {
+        this.conditionList = res.content || [];
+      });
+    },
+  },
+};
+</script>
+
+<style></style>

src/views/welfare/components/coverages/index.vue → src/views/welfare/info/components/coverages/index.vue

@@ -2,72 +2,70 @@
   <div>
     <!-- 分类 -->
     <div class="classify clearfix">
-      <a-button :type="!type ? 'primary' : ''">全部</a-button>
+      <a-button @click="specialtyChange('')" :type="!type ? 'primary' : ''">
+        全部
+      </a-button>
       <a-button
-        :type="item.code === type ? 'primary' : ''"
+        @click="specialtyChange(item.specialtyCode)"
+        :type="item.specialtyCode === type ? 'primary' : ''"
         v-for="item in welfareType"
-        :key="item.code"
+        :key="item.specialtyCode"
       >
-        {{ item.name }}
+        {{ item.specialtyDesc }}
       </a-button>
       <div class="save-btn">
-        <a-button type="danger" @click="addNew">
+        <!-- <a-button type="primary" @click="addNew">
           <Icon name="ssiadd" :size="14" />新增
-        </a-button>
+        </a-button> -->
         <a-button type="primary">
           <Icon name="ssidownload" :size="14" />保存
         </a-button>
       </div>
     </div>
-    <!-- table -->
-    <a-table
-      :columns="columns"
-      :data-source="dataList"
-      row-key="coverageCode"
-      :scroll="{ x: true }"
-      :pagination="pagination"
-      :expanded-row-keys.sync="expandedRowKeys"
-      @change="onWelfareChange"
-      @expand="handleExpand"
+    <a-collapse
+      v-model="activeKeys"
+      expand-icon-position="right"
+      :bordered="false"
     >
-      <template slot="operation" slot-scope="text, record, index">
-        <a-button
-          v-if="record.isEdit"
-          type="link"
-          @click.stop="saveEditData(record)"
-        >
-          保存
-        </a-button>
-        <a-button v-else type="link" @click.stop="editData(record, index)">
-          修改
-        </a-button>
-        <a-button type="link" class="success">新增</a-button>
-        <a-popconfirm
-          title="你确定要关闭吗？"
-          ok-text="确定"
-          cancel-text="取消"
-          @confirm="deleteData(record, index)"
-        >
-          <a-button type="link" class="danger">删除</a-button>
-        </a-popconfirm>
-      </template>
-      <template slot="expandedRowRender" slot-scope="record">
-        <benefits :coverageForm="record" />
-      </template>
-    </a-table>
+      <a-collapse-panel
+        v-for="item in coverageData"
+        :key="item.coverageCode"
+        :header="item.coverageCode"
+      >
+        <div>
+          <a-row class="policy_line" :gutter="10">
+            <a-col :span="6">是否开放直付：{{ item.isDirect }}</a-col>
+            <a-col :span="6">直付刷卡上限：</a-col>
+            <a-col :span="6">事先授权：</a-col>
+            <a-col :span="6">等待期：{{ item.waitingPeriod }}</a-col>
+          </a-row>
+          <a-row class="policy_line" :gutter="10">
+            <a-col :span="6">年限额：</a-col>
+            <a-col :span="6">限次：</a-col>
+            <a-col :span="6">免赔额：</a-col>
+            <a-col :span="6">赔付比例：</a-col>
+          </a-row>
+        </div>
+        <condition :formData="{ ...item, conditionType: '02' }" />
+        <benefits :formData="item" />
+      </a-collapse-panel>
+    </a-collapse>
   </div>
 </template>
 
 <script>
 import benefits from "../benefits";
+import condition from "../condition";
+
 export default {
   props: {
-    coverageForm: {
+    formData: {
       type: Object,
       required: true,
     },
   },
   components: {
+    condition,
     benefits,
   },
   data() {
@@ -139,7 +137,8 @@ export default {
     ];
     return {
       columns,
-      dataList: [{ coverageCode: 22 }],
+      activeKeys: "",
+      coverageData: [],
       expandedRowKeys: [],
       type: "",
       welfareType: [],
@@ -152,7 +151,8 @@ export default {
     };
   },
   watch: {
-    coverageForm: {
+    formData: {
+      immediate: true,
       deep: true,
       handler: function () {
         this.type = "";
@@ -160,24 +160,16 @@ export default {
       },
     },
   },
-  mounted() {
+  created() {
     this._getSpecialtyCode();
     // this._getCoverageList();
   },
-  computed: {
-    pagination() {
-      return this.initPageConfig(
-        { ...this.pager, total: this.total },
-        this.onWelfareSizeChange
-      );
-    },
-  },
   methods: {
     addNew() {
       const item = { isEdit: true, isNew: true };
       this.pager.pageSize++;
       this._getCoverageCode(); // 获取责任项目码表
-      this.dataList.unshift(item);
+      this.coverageData.unshift(item);
     },
     editData(record) {
       this._getCoverageCode(); // 获取责任项目码表
@@ -193,67 +185,14 @@ export default {
     },
     deleteData(record, index) {
       if (record.isNew) {
-        this.dataList.splice(index, 1);
+        this.coverageData.splice(index, 1);
         return true;
       }
-      this.dataList.splice(index, 1);
+      this.coverageData.splice(index, 1);
     },
-    initPageConfig(pager, sizeChange) {
-      const { pageNum, pageSize, total } = pager;
-      const pages = Math.ceil(total / pageSize);
-      return {
-        current: pageNum,
-        pageSize,
-        size: "large",
-        position: "bottom",
-        align: "right",
-        total: this.total,
-        hideOnSinglePage: false,
-        itemRender: (current, type, originalElement) => {
-          if (type === "prev") {
-            originalElement.children = undefined;
-            originalElement.text = "上一页";
-          }
-          if (type === "page") {
-            if (current !== pageNum) {
-              return undefined;
-            }
-            return (
-              <p>
-                <span class="current-page">{current}</span> / {pages}
-              </p>
-            );
-          }
-          if (type === "next") {
-            originalElement.children = undefined;
-            originalElement.text = "下一页";
-            return (
-              <div>
-                {originalElement}
-                <a-input-number
-                  onblur={sizeChange}
-                  class="size-change"
-                ></a-input-number>
-              </div>
-            );
-          }
-          return originalElement;
-        },
-      };
-    },
-    onWelfareChange(pager) {
-      const { current } = pager;
-      // console.log(pager);
-      this.pager.pageNum = current;
-      // this._getCustomerList();
-    },
-    onWelfareSizeChange(e) {
-      e && e.stopPropagation();
-      const val = e.target.value * 1;
-      if (!val || val < 0) {
-        return false;
-      }
-      this.pager.pageSize = val;
+    specialtyChange(code) {
+      this.type = code;
+      this._getCoverageList();
     },
     // 选择框筛选
     filterCode(input, option) {
@@ -263,20 +202,13 @@ export default {
           .indexOf(input.toLowerCase()) >= 0
       );
     },
-    handleExpand(expended, record) {
-      console.log(expended);
-      if (record.isEdit && expended) {
-        console.log(this.expandedRowKeys);
-        return false;
-      }
-    },
     _getSpecialtyCode() {
       this.$apis.GETSPECIALTYLIST().then((res) => {
         this.welfareType = res.content || [];
       });
     },
     _getCoverageList() {
-      const { corpCode, payorCode, planCode } = this.coverageForm;
+      const { corpCode, payorCode, planCode } = this.formData;
       this.$apis
         .GETCOVERAGELIST({
           corpCode,
@@ -285,7 +217,7 @@ export default {
           specialtyCode: this.type,
         })
         .then((res) => {
-          this.dataList = res.content || [];
+          this.coverageData = res.content || [];
         });
     },
     _getCoverageCode() {
@@ -304,6 +236,13 @@ export default {
 .none-label {
   text-align: right;
 }
+.policy_line {
+  .pa(0, 30, 0, 30);
+  line-height: 60px;
+  //   &:not(:last-child) {
+  border-bottom: 1px solid #f8fafb;
+  //   }
+}
 .classify {
   .pa(10, 20, 10, 20);
   .mg-t(30);

src/views/welfare/info/index.vue

+<template>
+  <div class="welfare">
+    <!-- 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="客户姓名" prop="patientName">
+            <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="出生日期" prop="birthday">
+            <a-date-picker
+              v-model="form.birthday"
+              placeholder="请选择出生日期"
+              value-format="YYYY-MM-DD"
+            ></a-date-picker>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="4" :lg="6" :sm="12">
+          <a-form-model-item label="保险公司" prop="payorId">
+            <a-select
+              v-model="form.payorId"
+              placeholder="请选择保险公司"
+              show-search
+              allow-clear
+              @change="payorChange"
+              @filterOption="filterCode"
+            >
+              <a-select-option
+                v-for="item in companyCode"
+                :key="item.id"
+                :value="item.id"
+              >
+                {{ item.longName }}
+              </a-select-option>
+            </a-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="7" :lg="6" :sm="12">
+          <a-form-model-item label="客户公司名称" prop="corpName">
+            <a-select
+              v-model="form.corpName"
+              placeholder="请选择客户公司名称"
+              show-search
+              allow-clear
+              @filterOption="filterCode"
+              @change="corpChange"
+            >
+              <a-select-option
+                v-for="item in corpCode"
+                :key="item.id"
+                :value="item.id + '$_' + item.longName"
+              >
+                {{ item.longName }}
+              </a-select-option>
+            </a-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="6" :lg="6" :sm="12">
+          <a-form-model-item label="保单卡号" prop="policyNo">
+            <a-input
+              v-model="form.policyNo"
+              allow-clear
+              placeholder="请输入保单卡号"
+            ></a-input>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="4" :lg="6" :sm="12">
+          <a-form-model-item label="首次入保时间" prop="firstEnrollmentTime">
+            <a-date-picker
+              v-model="form.firstEnrollmentTime"
+              placeholder="请选择首次入保时间"
+              value-format="YYYY-MM-DD"
+            ></a-date-picker>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="4" :lg="6" :sm="12">
+          <a-form-model-item label="保单生效日期" prop="startDate">
+            <a-date-picker
+              v-model="form.startDate"
+              placeholder="请选择保单生效日期"
+              value-format="YYYY-MM-DD"
+            ></a-date-picker>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="4" :lg="6" :sm="12">
+          <a-form-model-item label="保单终止日期" prop="endDate">
+            <a-date-picker
+              v-model="form.endDate"
+              placeholder="请选择保单终止日期"
+              value-format="YYYY-MM-DD"
+            ></a-date-picker>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="6" :lg="6" :sm="12">
+          <a-form-model-item label="保险计划" prop="planName">
+            <a-select
+              v-model="form.planName"
+              placeholder="请选择保险计划"
+              show-search
+              allow-clear
+              @filterOption="filterCode"
+            >
+              <a-select-option
+                v-for="item in planCode"
+                :key="item.id"
+                :vlaue="item.longName"
+              >
+                {{ item.longName }}
+              </a-select-option>
+            </a-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="6" :lg="6" :sm="12">
+          <a-form-model-item label="其他备注" prop="remark">
+            <a-input
+              v-model="form.remark"
+              allow-clear
+              placeholder="请输入备注信息"
+            ></a-input>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="4" :lg="6" :sm="12">
+          <a-form-model-item label="等待期" prop="waitingPeriod">
+            <a-radio-group
+              v-model="form.waitingPeriod"
+              :default-value="form.waitingPeriod"
+              button-style="solid"
+            >
+              <a-radio-button value="Y"> 是 </a-radio-button>
+              <a-radio-button class="mar-left10" value="N"> 否 </a-radio-button>
+            </a-radio-group>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="4" :lg="6" :sm="12">
+          <a-form-model-item label="等待期时间" prop="waitingPeriodTime">
+            <a-date-picker
+              v-model="form.waitingPeriodTime"
+              placeholder="请选择等待期时间"
+              value-format="YYYY-MM-DD"
+            ></a-date-picker>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="4" :lg="6" :sm="12">
+          <a-form-model-item label="是否承担既往症" prop="isUndertakeAnamnesis">
+            <a-radio-group
+              v-model="form.isUndertakeAnamnesis"
+              :default-value="form.isUndertakeAnamnesis"
+              button-style="solid"
+            >
+              <a-radio-button value="Y"> 是 </a-radio-button>
+              <a-radio-button class="mar-left10" value="N"> 否 </a-radio-button>
+            </a-radio-group>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xl="6" :lg="18" :sm="12" class="none-label">
+          <a-form-model-item label="button">
+            <a-button type="primary" class="text-r" @click="handlerReset">
+              <Icon name="ssireset" :size="14" />重置
+            </a-button>
+            <a-button type="primary" class="mar-left10" @click="handlerSearch"
+              ><Icon name="ssisearch_active" :size="14" />查询
+            </a-button>
+          </a-form-model-item>
+        </a-col>
+      </a-row>
+    </a-form-model>
+    <div v-if="customList && customList.length">
+      <a-table
+        :columns="customColumns"
+        :data-source="customList"
+        row-key="mrnNo"
+        :scroll="{ x: true }"
+        :pagination="false"
+        :customRow="handlerRowClick"
+      ></a-table>
+      <BurtPagination
+        :pagination="{ ...cusPager, total: cusTotal }"
+        @pageChange="onCustomChange"
+      />
+    </div>
+    <div v-if="isShowCoverageData">
+      <PolicyInfo :policyData="{}" />
+      <coverages :formData="coverageForm"></coverages>
+    </div>
+  </div>
+</template>
+
+<script>
+import BurtPagination from "@/components/CUSTOMER/pagation";
+import coverages from "./components/coverages";
+import PolicyInfo from "./components/PolicyInfo";
+export default {
+  beforeRouteUpdate(to, from, next) {
+    this.handlerReset();
+    next();
+  },
+  components: {
+    BurtPagination,
+    coverages,
+    PolicyInfo,
+  },
+  data() {
+    const customColumns = [
+      { title: "病历号", dataIndex: "mrnNo", width: 180 },
+      { title: "客户姓名", dataIndex: "patientName", width: 120 },
+      { title: "出生日期", dataIndex: "birthday", width: 180 },
+      { title: "性别", dataIndex: "sex", width: 80 },
+      { title: "保险公司", dataIndex: "payorName", width: 180 },
+      { title: "保单号码", dataIndex: "policyNo", width: 190 },
+      { title: "保险有效日期", dataIndex: "startDate", width: 180 },
+      { title: "保险终止日期", dataIndex: "endDate", width: 180 },
+    ];
+    return {
+      isShowCoverageData: false,
+      customColumns,
+      form: {
+        patientName: undefined,
+        payorId: undefined,
+        corpName: undefined,
+        planName: undefined,
+        birthday: undefined,
+        policyNo: undefined,
+        firstEnrollmentTime: undefined,
+        startDate: undefined,
+        endDate: undefined,
+        remark: undefined,
+        waitingPeriod: "N",
+        isUndertakeAnamnesis: "N",
+      },
+      detailForm: {},
+      coverageForm: {},
+      customList: [],
+      companyCode: [],
+      corpCode: [],
+      planCode: [],
+      queryForm: {},
+      cusPager: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+      cusTotal: 0,
+    };
+  },
+  mounted() {
+    if (this.$route.query && this.$route.query.id) {
+      this.detailForm = this.$route.query;
+      this.getCustomerDetail();
+    }
+    this._getPayorCode();
+  },
+  methods: {
+    onCustomChange(pager) {
+      const { pageNum } = pager;
+      // console.log(pager);
+      this.cusPager.pageNum = pageNum;
+      this._getCustomerList();
+    },
+    onCustomSizeChange(e) {
+      e && e.stopPropagation();
+      const val = e.target.value * 1;
+      if (!val || val < 0) {
+        return false;
+      }
+      this.cusPager.pageSize = val;
+      this._getCustomerList();
+    },
+    handlerRowClick(record) {
+      const { id, patientPolicyId } = record;
+      return {
+        on: {
+          click: () => {
+            this.detailForm = { id, patientPolicyId };
+            this.getCustomerDetail();
+          },
+        },
+      };
+    },
+    getCustomerDetail() {
+      // this.queryForm = this.$lodash.cloneDeep(this.form);
+      const { id, patientPolicyId } = this.detailForm;
+      const data = {
+        id: id && id * 1,
+        patientPolicyId: patientPolicyId * 1,
+      };
+      this.$apis.GETCUSTOMERDETAIL(data).then((res) => {
+        if (res.returnCode === "0000") {
+          const data = res.content || {};
+          for (let i in this.form) {
+            this.form[i] = data[i];
+          }
+          this.customList = [];
+          this.coverageForm = res.content || {};
+          this.isShowCoverageData = true;
+          this._getCorporateCode(this.coverageForm.payorId);
+          this._getPlanCode(this.coverageForm.corpId);
+        }
+        // this.dataList = (res.content && res.content.list) || [];
+        // this.total = (res.content && res.content.total) || 0;
+      });
+    },
+    handlerReset() {
+      this.$refs.form.resetFields();
+      this.customList = [];
+      this.isShowCoverageData = false;
+      this.coverageForm = {};
+    },
+    handlerSearch() {
+      console.log(this.$refs.form.validate);
+      this.$refs.form.validate((valid) => {
+        if (!valid) {
+          return false;
+        }
+        this.cusPager.pageNum = 1;
+        this.queryForm = this.$lodash.cloneDeep(this.form);
+        this._getCustomerList();
+      });
+    },
+    payorChange(val) {
+      this.form.corpName = undefined;
+      this.form.planName = undefined;
+      if (!val) {
+        return false;
+      }
+      this._getCorporateCode(val);
+    },
+    corpChange(val) {
+      // 因为接口要name  但是查计划要用id
+      this.form.planName = undefined;
+      if (!val) {
+        return false;
+      }
+      console.log(val);
+      this.form.corpName = val.split("$_")[1];
+      val = val.split("$_")[0];
+      this._getPlanCode(val);
+    },
+    // 选择框筛选
+    filterCode(input, option) {
+      return (
+        option.componentOptions.children[0].text
+          .toLowerCase()
+          .indexOf(input.toLowerCase()) >= 0
+      );
+    },
+    _getPayorCode() {
+      this.$apis.GETPAYORCODE({}).then((res) => {
+        this.companyCode = res.content || [];
+      });
+    },
+    _getCorporateCode(val) {
+      this.$apis
+        .GETCORPORATECODEBYPAYOR({
+          longName: "",
+          payorId: val,
+        })
+        .then((res) => {
+          this.corpCode = res.content || [];
+        });
+    },
+    _getPlanCode(val) {
+      this.$apis
+        .GETPLANCODEBYCORP({
+          longName: "",
+          corpId: val,
+        })
+        .then((res) => {
+          this.planCode = res.content || [];
+        });
+    },
+    _getCustomerList() {
+      const data = {
+        ...this.queryForm,
+        ...this.cusPager,
+      };
+      this.$apis.GETCUSTOMERLIST(data).then((res) => {
+        this.customList = (res.content && res.content.list) || [];
+        this.cusTotal = (res.content && res.content.total) || 0;
+      });
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.welfare {
+  .pa(30, 36, 50, 39);
+  background-color: #fff;
+  .none-label {
+    text-align: right;
+  }
+  .classify {
+    .pa(10, 20, 10, 20);
+    .mg-t(10);
+    .mg-b(10);
+    background-color: #f8fafb;
+    .ant-btn:not(:first-child) {
+      .mg-l(30);
+    }
+    .save-btn {
+      float: right;
+    }
+  }
+  .icon-class {
+    .mg-r(10);
+  }
+}
+/deep/.ant-collapse-item {
+  border: none !important;
+
+  .ant-collapse-header {
+    font-weight: bold;
+    background-color: #f8fafb;
+  }
+  .ant-collapse-content {
+    background-color: #fff !important;
+    .ant-collapse-content-box {
+      padding: 0;
+    }
+  }
+}
+</style>