From 59aa8eed8ebdfa1c1bc8066da3f1da33e60afba6 Mon Sep 17 00:00:00 2001
From: lihaoda <li.haoda@ebiz-fooge.com>
Date: Thu, 13 Feb 2020 15:36:16 +0800
Subject: [PATCH] fix

---
 src/views/ebiz/nbs/Base.vue      | 269 +++++++++++++++++++++++++
 src/views/ebiz/nbs/Chart.vue     | 134 +++++++++++++
 src/views/ebiz/nbs/CrewList.vue  | 111 +++++++++++
 src/views/ebiz/nbs/Detail.vue    | 195 ++++++++++++++++++
 src/views/ebiz/nbs/List.vue      | 227 +++++++++++++++++++++
 src/views/ebiz/nbs/Nav.vue       | 191 ++++++++++++++++++
 src/views/ebiz/nbs/Necessary.vue | 332 +++++++++++++++++++++++++++++++
 src/views/ebiz/nbs/PDF.vue       |  17 ++
 src/views/ebiz/nbs/Prepared.vue  | 232 +++++++++++++++++++++
 src/views/ebiz/nbs/Result.vue    |  71 +++++++
 10 files changed, 1779 insertions(+)
 create mode 100644 src/views/ebiz/nbs/Base.vue
 create mode 100644 src/views/ebiz/nbs/Chart.vue
 create mode 100644 src/views/ebiz/nbs/CrewList.vue
 create mode 100644 src/views/ebiz/nbs/Detail.vue
 create mode 100644 src/views/ebiz/nbs/List.vue
 create mode 100644 src/views/ebiz/nbs/Nav.vue
 create mode 100644 src/views/ebiz/nbs/Necessary.vue
 create mode 100644 src/views/ebiz/nbs/PDF.vue
 create mode 100644 src/views/ebiz/nbs/Prepared.vue
 create mode 100644 src/views/ebiz/nbs/Result.vue

diff --git a/src/views/ebiz/nbs/Base.vue b/src/views/ebiz/nbs/Base.vue
new file mode 100644
index 000000000..4a8ea351a
--- /dev/null
+++ b/src/views/ebiz/nbs/Base.vue
@@ -0,0 +1,269 @@
+<template>
+  <div class="base-container">
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">基本信息</p>
+    <van-field required clearable label="姓名" name="姓名" v-validate="'required|name'" v-model="form.customerName" placeholder="请输入"></van-field>
+    <select-radio required :radios="sexRadio" label="性别" name="性别" v-validate="'required'" :value.sync="form.customerSex"></select-radio>
+    <FieldDatePicter
+      v-validate="'required'"
+      required
+      label="出生日期"
+      name="出生日期"
+      type="date"
+      :flag="true"
+      :value.sync="form.birthday"
+      @confirm="onSelectBirth"
+    ></FieldDatePicter>
+    <van-field required label="年龄" name="年龄" v-validate="'required'" v-model="form.age" readonly placeholder="请选择出生日期"></van-field>
+    <occupation-picker
+      :value.sync="form.professionCode"
+      :chooseName.sync="form.professionName"
+      :lifeGrade.sync="form.lifeRiskGrade"
+      :healthGrade.sync="form.medicalRiskGrade"
+      clearable
+      label="职业"
+      name="职业"
+      required
+      v-validate="'required'"
+      placeholder="请选择"
+      @on-click="handleOccupationPickerClick"
+      @on-choose="handleOccupationPickerChoose"
+      :parentShowPicker.sync="isOccupationPickerPopupShow"
+    />
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">家庭信息</p>
+    <div class="relation">
+      <div v-for="(item, index) in form.proposalNbsFamilyDTOLst" :key="index">
+        <template v-if="item">
+          <van-field
+            readonly
+            clearable
+            label="关系"
+            name="关系"
+            right-icon="arrow"
+            placeholder="请选择"
+            @click="relationFieldClick(index)"
+            :value="getRelationText(item.relation)"
+          ></van-field>
+          <van-field clearable label="姓名" name="姓名" v-model="item.familyName" placeholder="请输入"></van-field>
+          <select-radio :radios="sexRadio" label="性别" name="性别" :value.sync="item.familySex" :required="false"></select-radio>
+          <FieldDatePicter
+            label="出生日期"
+            name="出生日期"
+            type="date"
+            :flag="true"
+            :value.sync="item.familyBirthday"
+            @confirm="onListSelectBirth(arguments, index)"
+          ></FieldDatePicter>
+          <van-field label="年龄" name="年龄" v-model="item.familyAge" readonly placeholder="请选择出生日期"></van-field>
+          <occupation-picker
+            :value.sync="item.familyProfessionCode"
+            :chooseName.sync="item.familyProfessionName"
+            :lifeGrade.sync="item.lifeRiskGrade"
+            :healthGrade.sync="item.medicalRiskGrade"
+            clearable
+            label="职业"
+            name="职业"
+            placeholder="请选择"
+            @on-click="item.isOccupationPickerPopupShow = true"
+            @on-choose="item.isOccupationPickerPopupShow = false"
+            :parentShowPicker.sync="item.isOccupationPickerPopupShow"
+          />
+          <div class="nbs-del" @click="delRelation(index)"><van-icon name="delete"></van-icon></div>
+        </template>
+      </div>
+    </div>
+    <div class="nbs-add" @click="addRelation">+ 添加家庭成员</div>
+    <van-button type="danger" class="bottom-btn" @click="submit" v-no-more-click="1000">完成</van-button>
+    <!-- 关系选择 -->
+    <van-popup v-model="isRelationPickerShow" position="bottom">
+      <van-picker show-toolbar :columns="relationNameArr" @confirm="onConfirm" @cancel="onCancel" />
+    </van-popup>
+  </div>
+</template>
+<script>
+import { Field, Popup, Picker } from 'vant'
+import SelectRadio from '@/components/ebiz/SelectRadio'
+import FieldDatePicter from '@/components/ebiz/FieldDatePicter'
+import ageUtil from '@/assets/js/utils/age'
+import OccupationPicker from '@/components/ebiz/occipation/OccupationPicker'
+import { saveForm, nbsDetail } from '@/api/ebiz/nbs'
+import utils from '@/assets/js/common'
+import utils2 from '@/assets/js/business-common'
+import dataDictionary from '@/assets/js/utils/data-dictionary'
+
+//关系字典
+let relationDictionary = dataDictionary.nbsRelation
+//拿出所有name，用于van-picker的column属性
+let relationNameArr = relationDictionary.map(v => v.name)
+
+//新增的家庭成员包含的属性
+let relationItem = {
+  relation: '',
+  familyName: '',
+  familySex: '',
+  familyBirthday: '',
+  familyAge: '',
+  familyProfessionCode: '',
+  familyProfessionName: '',
+  lifeRiskGrade: '',
+  medicalRiskGrade: '',
+  isDelete: '0',
+
+  //下面的属性 保存时不需要传
+  isOccupationPickerPopupShow: false
+}
+
+export default {
+  components: {
+    [Field.name]: Field,
+    [Popup.name]: Popup,
+    [Picker.name]: Picker,
+    SelectRadio,
+    FieldDatePicter,
+    OccupationPicker
+  },
+  data() {
+    return {
+      sexRadio: [
+        {
+          label: '男',
+          value: '0'
+        },
+        {
+          label: '女',
+          value: '1'
+        }
+      ],
+      form: {
+        customerName: '',
+        customerSex: '',
+        birthday: '',
+        age: '',
+        professionCode: '',
+        professionName: '',
+        lifeRiskGrade: '',
+        medicalRiskGrade: '',
+        proposalNbsFamilyDTOLst: [{ ...relationItem }],
+        isDelete: '0'
+      },
+      isOccupationPickerPopupShow: false,
+      relationNameArr,
+
+      isRelationPickerShow: false,
+      relationItemIndexJustClick: null
+    }
+  },
+  created() {
+    //回填
+    let id = localStorage.getItem('nbsId')
+    let state = localStorage.getItem('nbsState')
+    if (id && state) {
+      nbsDetail({
+        orderNo: id,
+        nbsState: state
+      }).then(res => {
+        let keys = Object.keys(this.form)
+        let obj = res.content
+        for (let i in obj) {
+          if (!keys.includes(i)) {
+            delete obj[i]
+          }
+        }
+
+        if (!obj.proposalNbsFamilyDTOLst) obj.proposalNbsFamilyDTOLst = [{ ...relationItem }]
+        //加上程序中需要的属性，这些属性提交时会删掉
+        obj.proposalNbsFamilyDTOLst.forEach(v => {
+          v.isOccupationPickerPopupShow = false
+        })
+
+        this.form = obj
+      })
+    }
+  },
+  methods: {
+    onSelectBirth(v) {
+      this.form.age = String(ageUtil.getAgeByBirth(v, new Date()))
+    },
+    onListSelectBirth(args, index) {
+      let v = args[0]
+      this.form.proposalNbsFamilyDTOLst[index].familyAge = String(ageUtil.getAgeByBirth(v, new Date()))
+    },
+    handleOccupationPickerClick() {
+      this.isOccupationPickerPopupShow = true
+    },
+    handleOccupationPickerChoose() {
+      this.isOccupationPickerPopupShow = false
+    },
+    onConfirm(value, index) {
+      //保存用户选择的关系
+      let clickIndex = this.relationItemIndexJustClick,
+        selectedVal = relationDictionary[index].value
+      this.form.proposalNbsFamilyDTOLst[clickIndex].relation = selectedVal
+      this.isRelationPickerShow = false
+    },
+    onCancel() {
+      this.isRelationPickerShow = false
+    },
+    relationFieldClick(index) {
+      this.isRelationPickerShow = true
+      this.relationItemIndexJustClick = index
+    },
+    getRelationText(value) {
+      for (let item of relationDictionary) {
+        if (item.value === value) {
+          return item.name
+        }
+      }
+    },
+    addRelation() {
+      this.form.proposalNbsFamilyDTOLst.push({ ...relationItem })
+    },
+    delRelation(index) {
+      this.$set(this.form.proposalNbsFamilyDTOLst, index, null)
+    },
+    submit() {
+      let id = localStorage.getItem('nbsId')
+
+      let form = utils.deepCopy(this.form)
+      delete form.occupationName
+      form.proposalNbsFamilyDTOLst = form.proposalNbsFamilyDTOLst.filter(v => v)
+      form.proposalNbsFamilyDTOLst.forEach(v => {
+        delete v.isOccupationPickerPopupShow
+      })
+
+      if (id) form.orderNo = id
+      form.type = '0'
+      form.dateOfEntry = utils2.formatDate(new Date(), 'yyyy-MM-dd HH:mm:ss')
+      form.isDelete = '0'
+      saveForm(form).then(res => {
+        if (res.result === '0') {
+          this.$toast('保存成功')
+
+          //如果是新建，id存在本地存储
+          if (!id) {
+            localStorage.setItem('nbsId', res.content.orderNo)
+            localStorage.setItem('nbsState', '01')
+          }
+
+          this.$jump({
+            flag: 'h5',
+            extra: {
+              url: location.origin + `/#/nbs/nav`
+            },
+            routerInfo: {
+              path: `/nbs/nav`
+            }
+          })
+        } else {
+          this.$toast(res.resultMessage)
+        }
+      })
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+@import '../../../assets/sass/nbs';
+.base-container {
+  @include container;
+}
+</style>
diff --git a/src/views/ebiz/nbs/Chart.vue b/src/views/ebiz/nbs/Chart.vue
new file mode 100644
index 000000000..7189d58d2
--- /dev/null
+++ b/src/views/ebiz/nbs/Chart.vue
@@ -0,0 +1,134 @@
+<template>
+  <div class="nbs-chart-container">
+    <div class="chart"></div>
+    <div class="list">
+      <ul>
+        <li v-for="item in data" @click="entryList(item.code)">
+          <div class="list-name">{{ item.name }}</div>
+          <div class="list-num">{{ item.value }}</div>
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+<script>
+import { nbsChart } from '@/api/ebiz/nbs'
+export default {
+  data() {
+    return {
+      data: []
+    }
+  },
+  mounted() {
+    let chart = window.echarts.init(document.querySelector('.chart'))
+    let option = {
+      series: [
+        {
+          type: 'pie',
+          radius: ['40%', '70%'],
+          label: {
+            normal: {
+              show: true,
+              position: 'inner',
+              formatter: '{b}:{c}'
+            }
+          },
+          itemStyle: {
+            normal: {
+              color({ dataIndex }) {
+                return ['#66cc00', '#3399ff', '#ffcc00'][dataIndex]
+              }
+            }
+          },
+          data: [{ value: 0, name: '' }]
+        }
+      ]
+    }
+    nbsChart({}).then(res => {
+      let data = res.content.proposalNbsCustomerDTOLst
+      data = data.map(v => {
+        let name = ''
+        switch (v.nbsState) {
+          case '01':
+            name = '录入数据'
+            break
+          case '02':
+            name = '生成报告'
+            break
+          case '03':
+            name = '销售成功'
+            break
+        }
+        return {
+          name,
+          value: Number(v.amount),
+          code: v.nbsState
+        }
+      })
+      option.series[0].data = data
+      this.data = data
+      chart.setOption(option)
+    })
+  },
+  methods: {
+    entryList(code) {
+      this.$jump({
+        flag: 'h5',
+        extra: {
+          url: location.origin + `/#/nbs/crew-list/${code}`
+        },
+        routerInfo: {
+          path: `/nbs/crew-list/${code}`
+        }
+      })
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.nbs-chart-container {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+}
+.chart {
+  flex-grow: 1;
+}
+.list {
+  height: 207px;
+  li {
+    position: relative;
+    height: 68px;
+    line-height: 68px;
+    border-top: 1px solid #c9c9c9;
+    &::before {
+      content: '';
+      position: absolute;
+      top: 27px;
+      left: 26px;
+      height: 15px;
+      width: 15px;
+      border-radius: 50%;
+    }
+    &:nth-child(1)::before {
+      background-color: #66cc00;
+    }
+    &:nth-child(2)::before {
+      background-color: #3399ff;
+    }
+    &:nth-child(3)::before {
+      background-color: #ffcc00;
+    }
+  }
+  &-name {
+    float: left;
+    margin-left: 57px;
+    font-size: 14px;
+  }
+  &-num {
+    float: right;
+    margin-right: 22px;
+    font-size: 16px;
+  }
+}
+</style>
diff --git a/src/views/ebiz/nbs/CrewList.vue b/src/views/ebiz/nbs/CrewList.vue
new file mode 100644
index 000000000..28cd61ece
--- /dev/null
+++ b/src/views/ebiz/nbs/CrewList.vue
@@ -0,0 +1,111 @@
+<template>
+  <div class="crew-list-container">
+    <van-sticky>
+      <table class="top-table">
+        <tr>
+          <td>
+            <div class="status">状态</div>
+          </td>
+          <td>
+            <div class="name">客户姓名</div>
+          </td>
+          <td>
+            <div class="date">录入时间</div>
+          </td>
+        </tr>
+      </table>
+    </van-sticky>
+    <table class="main-table">
+      <tr v-for="item in data">
+        <td>
+          <div class="status">{{ getTypeText(code) }}</div>
+        </td>
+        <td>
+          <div class="name">{{ item.customerName }}</div>
+        </td>
+        <td>
+          <div class="date">{{ item.dateOfEntry }}</div>
+        </td>
+      </tr>
+    </table>
+  </div>
+</template>
+<script>
+import { Sticky } from 'vant'
+import { nbsTable } from '@/api/ebiz/nbs'
+export default {
+  components: {
+    [Sticky.name]: Sticky
+  },
+  data() {
+    return {
+      data: [],
+      code: this.$route.params.code
+    }
+  },
+  methods: {
+    getTypeText(code) {
+      let name = ''
+      switch (code) {
+        case '01':
+          name = '录入数据'
+          break
+        case '02':
+          name = '生成报告'
+          break
+        case '03':
+          name = '销售成功'
+          break
+      }
+      return name
+    }
+  },
+  created() {
+    nbsTable({
+      nbsState: this.code
+    }).then(res => {
+      let data = res.content.proposalNbsCustomerDTOLst
+      this.data = data
+    })
+  }
+}
+</script>
+<style lang="scss" scoped>
+.crew-list-container {
+  overflow: hidden;
+  padding-top: 10px;
+}
+.top-table,
+.main-table {
+  margin: 0 auto;
+  border-collapse: collapse;
+  td {
+    border: 2px solid transparent;
+  }
+  .status,
+  .name,
+  .date {
+    height: 27px;
+    font-size: 14px;
+    text-align: center;
+    line-height: 27px;
+  }
+  .status,
+  .name {
+    width: 99px;
+  }
+  .date {
+    width: 151px;
+  }
+}
+.top-table {
+  div {
+    background: #ffb3b3;
+  }
+}
+.main-table {
+  tr:nth-child(even) div {
+    background: #ffe6e6;
+  }
+}
+</style>
diff --git a/src/views/ebiz/nbs/Detail.vue b/src/views/ebiz/nbs/Detail.vue
new file mode 100644
index 000000000..e9c70922c
--- /dev/null
+++ b/src/views/ebiz/nbs/Detail.vue
@@ -0,0 +1,195 @@
+<template>
+  <div>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">基本信息</p>
+    <van-field readonly label="姓名" name="姓名" v-model="form.customerName"></van-field>
+    <van-field readonly label="性别" name="性别" :value="getSex(form.customerSex)"></van-field>
+    <van-field readonly label="出生日期" name="出生日期" v-model="form.birthday"></van-field>
+    <van-field label="年龄" name="年龄" v-model="form.age" readonly></van-field>
+    <!-- 为了让职业可以换行 -->
+    <!-- <van-field label="职业" name="职业" v-model="form.professionName" readonly></van-field> -->
+    <div class="van-cell van-field">
+      <div class="van-cell__title van-field__label">
+        <span>职业</span>
+      </div>
+      <div class="van-cell__value">
+        <div class="van-field__body" style="color: #323233;text-align: left">
+          {{form.professionName}}
+        </div>
+      </div>
+    </div>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">家庭信息</p>
+    <div class="relation">
+      <div v-for="(item, index) in form.proposalNbsFamilyDTOLst" :key="index">
+        <template v-if="item">
+          <van-field readonly label="关系" name="关系" placeholder="请选择" :value="getRelationText(item.relation)"></van-field>
+          <van-field readonly label="姓名" name="姓名" v-model="item.familyName"></van-field>
+          <van-field readonly label="性别" name="性别" :value="getSex(item.familySex)"></van-field>
+          <van-field readonly label="出生日期" name="出生日期" v-model="item.familyBirthday"></van-field>
+          <van-field label="年龄" name="年龄" v-model="item.familyAge" readonly></van-field>
+          <!-- 为了让职业可以换行 -->
+          <!-- <van-field label="职业" name="职业" v-model="item.familyProfessionName" readonly></van-field> -->
+          <div class="van-cell van-field">
+            <div class="van-cell__title van-field__label">
+              <span>职业</span>
+            </div>
+            <div class="van-cell__value">
+              <div class="van-field__body" style="color: #323233;text-align: left">
+                {{item.familyProfessionName}}
+              </div>
+            </div>
+          </div>
+        </template>
+      </div>
+    </div>
+
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">需求顺位</p>
+    <van-field readonly label="第一顺位需求" name="第一顺位需求" placeholder="请选择" :value="getNecessaryText(form.firstCostRequirements)"></van-field>
+    <van-field readonly label="第二顺位需求" name="第二顺位需求" placeholder="请选择" :value="getNecessaryText(form.secondCostRequirements)"></van-field>
+    <van-field readonly label="第三顺位需求" name="第三顺位需求" placeholder="请选择" :value="getNecessaryText(form.thirdCostRequirements)"></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">生活费用</p>
+    <van-field readonly label="每月生活费（元）" name="每月生活费（元）" placeholder="请输入" v-model="form.livingCosts"></van-field>
+    <van-field readonly label="子女抚养至（岁）" name="子女抚养至（岁）" placeholder="请输入" v-model="form.raisingAge"></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">房贷/房租费用</p>
+    <van-field readonly label="贷款余额（万元）" name="贷款余额（万元）" placeholder="请输入" v-model="form.loanBalance"></van-field>
+    <van-field readonly label="剩余还款期间（年）" name="剩余还款期间（年）" placeholder="请输入" v-model="form.remainRepaymentTime"></van-field>
+    <van-field readonly label="租金（元/月）" name="租金（元/月）" placeholder="请输入" v-model="form.charterMoney"></van-field>
+    <van-field readonly label="租屋年数（年）" name="租屋年数（年）" placeholder="请输入" v-model="form.rentHouseNumber"></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">父母孝养金</p>
+    <van-field readonly label="本人父亲年龄" name="本人父亲年龄" placeholder="请输入" v-model="form.myParentsAge"></van-field>
+    <van-field readonly label="本人母亲年龄" name="本人母亲年龄" placeholder="请输入" v-model="form.myMotherAge"></van-field>
+    <van-field readonly label="孝养金（元/月）" name="孝养金（元/月）" placeholder="请输入" v-model="form.myParentsRaisemoney"></van-field>
+    <van-field readonly label="配偶父亲年龄" name="配偶父亲年龄" placeholder="请输入" v-model="form.wifeParentsAge"></van-field>
+    <van-field readonly label="配偶母亲年龄" name="配偶母亲年龄" placeholder="请输入" v-model="form.wifeMotherAge"></van-field>
+    <van-field readonly label="孝养金（元/月）" name="孝养金（元/月）" placeholder="请输入" v-model="form.wifeParentsRaisemoney"></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">教育费用</p>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl15 pv12">子女1</p>
+    <van-field readonly label="费用总计（万元）" name="费用总计（万元）" placeholder="请输入" v-model="form.educationalCostOne"></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl15 pv12">子女2</p>
+    <van-field readonly label="费用总计（万元）" name="费用总计（万元）" placeholder="请输入" v-model="form.educationalCostTwo"></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl15 pv12">子女3</p>
+    <van-field readonly label="费用总计（万元）" name="费用总计（万元）" placeholder="请输入" v-model="form.educationalCostThree"></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl15 pv12">医疗费用</p>
+    <van-field readonly label="往来医院" name="往来医院" placeholder="请输入" v-model="form.hospitalizationCost"></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl15 pv12">最后费用</p>
+    <van-field readonly label="本人身故丧葬费用（万元）" name="本人身故丧葬费用（万元）" placeholder="请输入" v-model="form.myFuneralExpenses"></van-field>
+    <van-field readonly label="配偶身故丧葬费用（万元）" name="配偶身故丧葬费用（万元）" placeholder="请输入" v-model="form.wifeFuneralExpenses"></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl15 pv12">资产传承</p>
+    <van-field readonly label="本人预估资产总额（万元）" name="本人预估资产总额（万元）" placeholder="请输入" v-model="form.myEstimateTotalassets"></van-field>
+    <van-field
+      readonly
+      label="配偶预估资产总额（万元）"
+      name="配偶预估资产总额（万元）"
+      placeholder="请输入"
+      v-model="form.wifeEstimateTotalassets"
+    ></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">其它费用</p>
+    <div v-for="(item, index) in form.proposalNbsProjectCostInfoDTOLst" :key="index">
+      <template v-if="item">
+        <van-field readonly label="对象" name="对象" placeholder="请选择" :value="getTargetText(item.object)"></van-field>
+        <van-field readonly label="项目" name="项目" placeholder="请输入" v-model="item.projectName"></van-field>
+        <van-field readonly label="金额（元/月）" name="金额（元/月）" placeholder="请输入" v-model="item.projectCost"></van-field>
+        <van-field readonly label="起始年月" name="起始年月" placeholder="请输入" v-model="item.startDate"></van-field>
+        <van-field readonly label="终止年月" name="终止年月" placeholder="请输入" v-model="item.endDate"></van-field>
+      </template>
+    </div>
+
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">已投保保险</p>
+    <div v-for="(item, index) in form.proposalNbsInsuredInfoDTOLst" :key="index">
+      <template v-if="item">
+        <van-field readonly label="对象" name="对象" placeholder="请选择" :value="getTargetText(item.haveiNsurance)"></van-field>
+        <van-field readonly label="险种类型" name="险种类型" placeholder="请选择" :value="getInsuranceText(item.plantType)"></van-field>
+        <van-field readonly label="满期岁" name="满期岁" placeholder="请输入" v-model="item.ageofMaturity"></van-field>
+        <van-field readonly label="保险金额（万元）" name="保险金额（万元）" placeholder="请输入" v-model="item.insuredAmount"></van-field>
+      </template>
+    </div>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">收入及储蓄</p>
+    <van-field readonly label="目前年收入（万元）" name="目前年收入（万元）" placeholder="请输入" v-model="form.myAnnualIncome"></van-field>
+    <van-field readonly label="预计工作至（岁）" name="预计工作至（岁）" placeholder="请输入" v-model="form.myFutureWorkinglife"></van-field>
+    <van-field readonly label="其它收入（万元/年）" name="其它收入（万元/年）" placeholder="请输入" v-model="form.myOtherRevenue"></van-field>
+    <van-field readonly label="预计可收年数（年）" name="预计可收年数（年）" placeholder="请输入" v-model="form.myOtherRevenueExpectedyear"></van-field>
+    <van-field readonly label="现有储蓄（万元）" name="现有储蓄（万元）" placeholder="请输入" v-model="form.myAssets"></van-field>
+    <van-field readonly label="配偶目前年收入（万元）" name="配偶目前年收入（万元）" placeholder="请输入" v-model="form.wifeAnnualIncome"></van-field>
+    <van-field readonly label="配偶预计工作至（岁）" name="配偶预计工作至（岁）" placeholder="请输入" v-model="form.wifeFutureWorkinglife"></van-field>
+    <van-field readonly label="配偶其它收入（万元/年）" name="配偶其它收入（万元/年）" placeholder="请输入" v-model="form.wifeOtherRevenue"></van-field>
+    <van-field
+      readonly
+      label="配偶预计可收年数（年）"
+      name="配偶预计可收年数（年）"
+      placeholder="请输入"
+      v-model="form.wifeOtherRevenueExpectedyear"
+    ></van-field>
+    <van-field readonly label="配偶现有储蓄（万元）" name="配偶现有储蓄（万元）" placeholder="请输入" v-model="form.wifeAssets"></van-field>
+  </div>
+</template>
+<script>
+import { Field } from 'vant'
+import { nbsDetail } from '@/api/ebiz/nbs'
+import dataDictionary from '@/assets/js/utils/data-dictionary'
+
+//关系字典
+let relationDictionary = dataDictionary.nbsRelation
+let sexDictionary = dataDictionary.sex
+let targetDictionary = dataDictionary.targetDictionary
+let necessaryDictionary = dataDictionary.necessaryDictionary
+let insuranceDictionary = dataDictionary.insuranceDictionary
+
+export default {
+  components: {
+    [Field.name]: Field
+  },
+  data() {
+    return {
+      form: {}
+    }
+  },
+  created() {
+    let id = this.$route.params.id
+    let state = this.$route.params.state
+    nbsDetail({
+      orderNo: id,
+      nbsState: state
+    }).then(res => {
+      this.form = res.content
+    })
+  },
+  methods: {
+    getRelationText(value) {
+      for (let item of relationDictionary) {
+        if (item.value === value) {
+          return item.name
+        }
+      }
+    },
+    getSex(code) {
+      let text = ''
+      sexDictionary.forEach(v => {
+        if (v.id === code) {
+          text = v.text
+        }
+      })
+      return text
+    },
+    getTargetText(code) {
+      for (let v of targetDictionary) {
+        if (v.code === code) {
+          return v.value
+        }
+      }
+    },
+    getNecessaryText(code) {
+      for (let i of necessaryDictionary) {
+        if (i.code === code) {
+          return i.value
+        }
+      }
+    },
+    getInsuranceText(code) {
+      for (let v of insuranceDictionary) {
+        if (v.code === code) {
+          return v.value
+        }
+      }
+    }
+  }
+}
+</script>
diff --git a/src/views/ebiz/nbs/List.vue b/src/views/ebiz/nbs/List.vue
new file mode 100644
index 000000000..1daef29c9
--- /dev/null
+++ b/src/views/ebiz/nbs/List.vue
@@ -0,0 +1,227 @@
+<template>
+  <div class="nbs-list-container">
+    <van-sticky>
+      <van-tabs v-model="activeTab" @change="tabChange">
+        <van-tab title="制作中"></van-tab>
+        <van-tab title="已制作"></van-tab>
+        <van-tab title="销售成功"></van-tab>
+      </van-tabs>
+    </van-sticky>
+    <van-list class="pb45" v-model="loading" :finished="finished" @load="getList" v-if="list.length > 0">
+      <div v-for="(item, index) in list" :key="item.orderNo">
+        <div class="text-center fs12 mv15">{{ item.dateOfEntry }}</div>
+        <div class="bg-white m15 p15">
+          <div class="fs14">{{ item.customerName }}的智能分析</div>
+          <div class="text-right mt5">
+            <template v-if="params.nbsState === '01'">
+              <van-button class="ml5" type="danger" size="small" round @click="edit(item.orderNo)">编辑</van-button>
+              <van-button class="ml5" type="danger" size="small" round plain @click="del(item.orderNo, index)">删除</van-button>
+            </template>
+            <template v-else>
+              <van-button class="ml5" type="danger" size="small" round v-if="params.nbsState === '02'" @click="complete(item.orderNo, index)"
+                >销售成功</van-button
+              >
+              <van-button class="ml5" type="danger" size="small" round @click="entryDetail(item.orderNo)">资料</van-button>
+              <van-button class="ml5" type="danger" size="small" round @click="entryReport(item.orderNo, item.flag)">报告</van-button>
+              <van-button class="ml5" type="danger" size="small" round plain @click="del(item.orderNo, index)">删除</van-button>
+            </template>
+          </div>
+        </div>
+      </div>
+    </van-list>
+    <div v-else class="text-center">
+      <img class="mt40 w250" src="@/assets/images/pic_page-non.png" />
+      <div class="fs17 c-gray-dark mt40">暂无数据</div>
+    </div>
+    <!-- <div class="empty" v-else>暂无数据</div> -->
+    <van-button type="danger" class="bottom-btn" @click="add" v-no-more-click="1000">点我新增</van-button>
+  </div>
+</template>
+<script>
+import { Tabs, Tab, List, Sticky, Dialog } from 'vant'
+import { getList, delNbs, completeNbs } from '@/api/ebiz/nbs'
+export default {
+  data() {
+    return {
+      activeTab: 0,
+      params: {
+        pageSize: 20,
+        pageNum: 1,
+        nbsState: '01'
+      },
+      list: [],
+      finished: false,
+      loading: false
+    }
+  },
+  created() {
+    // eslint-disable-next-line no-undef
+    EWebBridge.webCallAppInJs('webview_right_button', {
+      btns: [
+        {
+          img: this.$assetsUrl + 'images/nbs/chart.png',
+          route: { flag: '', extra: {} }
+        }
+      ]
+    })
+
+    this.getList()
+  },
+  mounted() {
+    window.appCallBack = this.appCallBack
+  },
+  methods: {
+    appCallBack() {
+      this.$jump({
+        flag: 'h5',
+        extra: {
+          url: location.origin + `/#/nbs/chart`
+        },
+        routerInfo: {
+          path: `/nbs/chart`
+        }
+      })
+    },
+    getList() {
+      //保存下来目前的tab标签，接口调用成功以后如果标签页切换了，就不修改列表
+      let currentTab = this.activeTab
+
+      let params = this.params
+      this.loading = true
+      getList(params).then(res => {
+        if (currentTab !== this.activeTab) {
+          return
+        }
+        this.loading = false
+        if (res.content && res.content.list.length !== 0) {
+          let list = res.content.list
+          this.list = this.list.concat(list)
+          params.pageNum++
+        } else {
+          this.finished = true
+        }
+      })
+    },
+    add() {
+      localStorage.setItem('nbsId', '')
+      this.$jump({
+        flag: 'h5',
+        extra: {
+          url: location.origin + `/#/nbs/nav`
+        },
+        routerInfo: {
+          path: `/nbs/nav`
+        }
+      })
+    },
+    tabChange(name) {
+      this.finished = false
+      this.list = []
+      let params = this.params
+      params.pageNum = 1
+      switch (name) {
+        case 0:
+          params.nbsState = '01'
+          break
+        case 1:
+          params.nbsState = '02'
+          break
+        case 2:
+          params.nbsState = '03'
+          break
+      }
+      this.getList()
+    },
+    del(id, index) {
+      Dialog.confirm({
+        message: '确认要删除吗'
+      }).then(() => {
+        delNbs({
+          orderNo: id,
+          nbsState: this.params.nbsState
+        }).then(res => {
+          if (res.result === '0') {
+            this.$toast('删除成功')
+            this.list.splice(index, 1)
+          } else {
+            this.$toast(res.resultMessage)
+          }
+        })
+      })
+    },
+    complete(id, index) {
+      Dialog.confirm({
+        message: '确认要操作吗'
+      }).then(() => {
+        completeNbs({
+          orderNo: id
+        }).then(res => {
+          if (res.result === '0') {
+            this.$toast('操作成功')
+            this.list.splice(index, 1)
+          } else {
+            this.$toast(res.resultMessage)
+          }
+        })
+      })
+    },
+    edit(id) {
+      //详情接口需要传状态
+      localStorage.setItem('nbsState', this.params.nbsState)
+      localStorage.setItem('nbsId', id)
+      this.$jump({
+        flag: 'h5',
+        extra: {
+          url: location.origin + `/#/nbs/nav`
+        },
+        routerInfo: {
+          path: `/nbs/nav`
+        }
+      })
+    },
+    entryDetail(id) {
+      let state = this.params.nbsState
+      this.$jump({
+        flag: 'h5',
+        extra: {
+          url: location.origin + `/#/nbs/detail/${id}/${state}`
+        },
+        routerInfo: {
+          path: `/nbs/detail/${id}/${state}`
+        }
+      })
+    },
+    entryReport(id, flag) {
+      const state = this.params.nbsState
+      this.$jump({
+        flag: 'h5',
+        extra: {
+          url: location.origin + `/#/nbs/result/${id}/${flag}/${state}`
+        },
+        routerInfo: {
+          path: `/nbs/result/${id}/${flag}/${state}`
+        }
+      })
+    }
+  },
+  components: {
+    [Tabs.name]: Tabs,
+    [Tab.name]: Tab,
+    [List.name]: List,
+    [Sticky.name]: Sticky
+  }
+}
+</script>
+<style lang="scss" scoped>
+.empty {
+  margin: 106px auto 0 auto;
+  width: 195px;
+  height: 20px;
+  padding-top: 211px;
+  font-size: 14px;
+  line-height: 14px;
+  text-align: center;
+  background: url(../../../assets/images/nbs/empty.png) no-repeat;
+  background-size: 100%;
+}
+</style>
diff --git a/src/views/ebiz/nbs/Nav.vue b/src/views/ebiz/nbs/Nav.vue
new file mode 100644
index 000000000..42d808941
--- /dev/null
+++ b/src/views/ebiz/nbs/Nav.vue
@@ -0,0 +1,191 @@
+<template>
+  <div>
+    <div class="pic"></div>
+    <div class="text">专业解析<span>智能分析</span>量身定制</div>
+    <div class="flow">
+      <div class="flow-item" :class="{ active: getButtonStatus(-1) }">
+        <div class="flow-button" @click="getButtonStatus(-1) && entry(-1)">基本资料</div>
+      </div>
+      <div class="flow-item" :class="{ active: getButtonStatus(0) }">
+        <div class="flow-arrow">
+          <van-icon name="arrow-down" size="30" />
+        </div>
+        <div class="flow-button" @click="getButtonStatus(0) && entry(0)">应备费用</div>
+      </div>
+      <div class="flow-item" :class="{ active: getButtonStatus(1) }">
+        <div class="flow-arrow">
+          <van-icon name="arrow-down" size="30" />
+        </div>
+        <div class="flow-button" @click="getButtonStatus(1) && entry(1)">已备费用</div>
+      </div>
+      <div class="flow-item" :class="{ active: getButtonStatus(2) }">
+        <div class="flow-arrow">
+          <van-icon name="arrow-down" size="30" />
+        </div>
+        <div class="flow-button" @click="getButtonStatus(2) && entry(2)">生成报告</div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import { nbsDetail, saveForm } from '@/api/ebiz/nbs'
+export default {
+  data() {
+    return {
+      status: -1, //-1还未填写 0填完基本信息 1填完应备费用 2填完已备费用
+      half: null //这个值表示是否添加了配偶
+    }
+  },
+  created() {
+    let id = localStorage.getItem('nbsId')
+    //获取到了哪一步
+    if (id) {
+      nbsDetail({
+        orderNo: id,
+        nbsState: localStorage.getItem('nbsState')
+      }).then(res => {
+        if (res.result === '0') {
+          const content = res.content
+          this.status = Number(content.type)
+          this.half = content.flag
+        } else {
+          this.$toast(res.resultMessage)
+          this.$jump({
+            flag: 'h5',
+            extra: {
+              url: location.origin + `/#/nbs/list`
+            },
+            routerInfo: {
+              path: `/nbs/list`
+            }
+          })
+        }
+      })
+    }
+  },
+  methods: {
+    getButtonStatus(buttonStatus) {
+      //当status大于buttonStatus时，可以点击按钮
+      let status = this.status
+      if (status >= buttonStatus) {
+        return true
+      } else {
+        return false
+      }
+    },
+    entry(buttonStatus) {
+      let name = ''
+      switch (buttonStatus) {
+        case -1:
+          name = 'base'
+          break
+        case 0:
+          name = 'necessary'
+          break
+        case 1:
+          name = 'prepared'
+          break
+        case 2:
+          name = 'result'
+          break
+      }
+      if (buttonStatus === 2) {
+        saveForm({
+          type: '3',
+          orderNo: localStorage.getItem('nbsId')
+        }).then(res => {
+          if (res.result === '0') {
+            let id = localStorage.getItem('nbsId')
+            this.$jump({
+              flag: 'h5',
+              extra: {
+                url: location.origin + `/#/nbs/result/${id}/${this.half}/02`
+              },
+              routerInfo: {
+                path: `/nbs/result/${id}/${this.half}/02`
+              }
+            })
+          } else {
+            this.$toast(res.resultMessage)
+          }
+        })
+      } else {
+        this.$jump({
+          flag: 'h5',
+          extra: {
+            url: location.origin + `/#/nbs/${name}`
+          },
+          routerInfo: {
+            path: `/nbs/${name}`
+          }
+        })
+      }
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.pic {
+  // width: 272px;
+  width: 200px;
+  // height: 195px;
+  height: 143px;
+  margin: 40px auto 0 auto;
+  background: url(../../../assets/images/nbs/nav.png) no-repeat;
+  background-size: 100%;
+}
+.text {
+  margin-top: 22px;
+  font-size: 12px;
+  line-height: 12px;
+  text-align: center;
+  span {
+    position: relative;
+    margin: 0 40px;
+    &::before,
+    &::after {
+      content: '';
+      position: absolute;
+      top: 0px;
+      height: 14px;
+      width: 14px;
+      border-radius: 50%;
+      background: url(../../../assets/images/nbs/dot.png) no-repeat;
+      background-size: 100%;
+    }
+    &::before {
+      left: -24px;
+    }
+    &::after {
+      right: -24px;
+    }
+  }
+}
+.flow {
+  position: absolute;
+  bottom: 17px;
+  left: 0;
+  width: 100%;
+  &-item {
+    color: #797979;
+  }
+  &-button {
+    width: 325px;
+    height: 32px; //38
+    margin: 0 auto;
+    border: 1px solid #797979;
+    border-radius: 20px;
+    line-height: 32px;
+    text-align: center;
+  }
+  &-arrow {
+    text-align: center;
+  }
+}
+.flow-item.active {
+  color: #e5162d;
+  .flow-button {
+    border-color: #e5162d;
+  }
+}
+</style>
diff --git a/src/views/ebiz/nbs/Necessary.vue b/src/views/ebiz/nbs/Necessary.vue
new file mode 100644
index 000000000..001b432d1
--- /dev/null
+++ b/src/views/ebiz/nbs/Necessary.vue
@@ -0,0 +1,332 @@
+<template>
+  <div class="necessary-container">
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">基本信息</p>
+    <van-field
+      readonly
+      label="第一顺位需求"
+      name="第一顺位需求"
+      right-icon="arrow"
+      placeholder="请选择"
+      @click="necessaryFieldClick(1)"
+      :value="getNecessaryText(form.firstCostRequirements)"
+    ></van-field>
+    <van-field
+      readonly
+      label="第二顺位需求"
+      name="第二顺位需求"
+      right-icon="arrow"
+      placeholder="请选择"
+      @click="necessaryFieldClick(2)"
+      :value="getNecessaryText(form.secondCostRequirements)"
+    ></van-field>
+    <van-field
+      readonly
+      label="第三顺位需求"
+      name="第三顺位需求"
+      right-icon="arrow"
+      placeholder="请选择"
+      @click="necessaryFieldClick(3)"
+      :value="getNecessaryText(form.thirdCostRequirements)"
+    ></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">生活费用</p>
+    <van-field clearable label="每月生活费（元）" name="每月生活费（元）" placeholder="请输入" v-model="form.livingCosts"></van-field>
+    <van-field clearable label="子女抚养至（岁）" name="子女抚养至（岁）" placeholder="请输入" v-model="form.raisingAge"></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">房贷/房租费用</p>
+    <van-field clearable label="贷款余额（万元）" name="贷款余额（万元）" placeholder="请输入" v-model="form.loanBalance"></van-field>
+    <van-field clearable label="剩余还款期间（年）" name="剩余还款期间（年）" placeholder="请输入" v-model="form.remainRepaymentTime"></van-field>
+    <van-field clearable label="租金（元/月）" name="租金（元/月）" placeholder="请输入" v-model="form.charterMoney"></van-field>
+    <van-field clearable label="租屋年数（年）" name="租屋年数（年）" placeholder="请输入" v-model="form.rentHouseNumber"></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">父母孝养金</p>
+    <van-field clearable label="本人父亲年龄" name="本人父亲年龄" placeholder="请输入" v-model="form.myParentsAge"></van-field>
+    <van-field clearable label="本人母亲年龄" name="本人母亲年龄" placeholder="请输入" v-model="form.myMotherAge"></van-field>
+    <van-field clearable label="孝养金（元/月）" name="孝养金（元/月）" placeholder="请输入" v-model="form.myParentsRaisemoney"></van-field>
+    <van-field clearable label="配偶父亲年龄" name="配偶父亲年龄" placeholder="请输入" v-model="form.wifeParentsAge"></van-field>
+    <van-field clearable label="配偶母亲年龄" name="配偶母亲年龄" placeholder="请输入" v-model="form.wifeMotherAge"></van-field>
+    <van-field clearable label="孝养金（元/月）" name="孝养金（元/月）" placeholder="请输入" v-model="form.wifeParentsRaisemoney"></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">教育费用</p>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl15 pv12">子女1</p>
+    <van-field clearable label="费用总计（万元）" name="费用总计（万元）" placeholder="请输入" v-model="form.educationalCostOne"></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl15 pv12">子女2</p>
+    <van-field clearable label="费用总计（万元）" name="费用总计（万元）" placeholder="请输入" v-model="form.educationalCostTwo"></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl15 pv12">子女3</p>
+    <van-field clearable label="费用总计（万元）" name="费用总计（万元）" placeholder="请输入" v-model="form.educationalCostThree"></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl15 pv12">医疗费用</p>
+    <van-field clearable label="往来医院" name="往来医院" placeholder="请输入" v-model="form.hospitalizationCost"></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl15 pv12">最后费用</p>
+    <van-field clearable label="本人身故丧葬费用（万元）" name="本人身故丧葬费用（万元）" placeholder="请输入" v-model="form.myFuneralExpenses"></van-field>
+    <van-field clearable label="配偶身故丧葬费用（万元）" name="配偶身故丧葬费用（万元）" placeholder="请输入" v-model="form.wifeFuneralExpenses"></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl15 pv12">资产传承</p>
+    <van-field clearable label="本人预估资产总额（万元）" name="本人预估资产总额（万元）" placeholder="请输入" v-model="form.myEstimateTotalassets"></van-field>
+    <van-field
+      clearable
+      label="配偶预估资产总额（万元）"
+      name="配偶预估资产总额（万元）"
+      placeholder="请输入"
+      v-model="form.wifeEstimateTotalassets"
+    ></van-field>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">其它费用</p>
+    <div v-for="(item, index) in form.proposalNbsProjectCostInfoDTOLst" :key="index">
+      <template v-if="item">
+        <van-field
+          clearable
+          readonly
+          label="对象"
+          name="对象"
+          right-icon="arrow"
+          placeholder="请选择"
+          @click="targetFieldClick(index)"
+          :value="getTargetText(item.object)"
+        ></van-field>
+        <van-field clearable label="项目" name="项目" placeholder="请输入" v-model="item.projectName"></van-field>
+        <van-field clearable label="金额（元/月）" name="金额（元/月）" placeholder="请输入" v-model="item.projectCost"></van-field>
+        <!-- 起始年月和终止年月只能选择本月及以后 -->
+        <FieldDatePicter
+          label="起始年月"
+          name="起始年月"
+          type="year-month"
+          :flag="true"
+          :value.sync="item.startDate"
+          :formatter="dateFormatter"
+          :min-date="new Date()"
+        ></FieldDatePicter>
+        <FieldDatePicter
+          label="终止年月"
+          name="终止年月"
+          type="year-month"
+          :flag="true"
+          :value.sync="item.endDate"
+          :formatter="dateFormatter"
+          :min-date="new Date()"
+        ></FieldDatePicter>
+        <div class="nbs-del" @click="del(index)"><van-icon name="delete"></van-icon></div>
+      </template>
+    </div>
+    <div class="nbs-add" @click="add">+ 添加其它费用</div>
+    <van-button type="danger" class="bottom-btn" @click="submit" v-no-more-click="1000">完成</van-button>
+
+    <!-- 顺位需求选择 -->
+    <van-popup v-model="isNecessaryPickerShow" position="bottom">
+      <van-picker show-toolbar :columns="necessaryArr" @confirm="onNecessaryConfirm" @cancel="onNecessaryCancel" />
+    </van-popup>
+    <!-- 对象选择 -->
+    <van-popup v-model="isTargetPickerShow" position="bottom">
+      <van-picker show-toolbar :columns="targetArr" @confirm="onTargetConfirm" @cancel="onTargetCancel" />
+    </van-popup>
+  </div>
+</template>
+<script>
+import { Field, Popup, Picker } from 'vant'
+import FieldDatePicter from '@/components/ebiz/FieldDatePicter'
+import dataDictionary from '@/assets/js/utils/data-dictionary'
+import { saveForm, nbsDetail } from '@/api/ebiz/nbs'
+import utils from '@/assets/js/common'
+import utils2 from '@/assets/js/business-common'
+
+//顺位需求字典
+let necessaryDictionary = dataDictionary.necessaryDictionary
+
+//对象字典
+let targetDictionary = dataDictionary.targetDictionary
+
+//其它费用
+let otherCost = {
+  object: '',
+  projectName: '',
+  projectCost: '',
+  startDate: '',
+  endDate: '',
+  //这两个必传，写死
+  isDelete: '0',
+  projectinfoId: ''
+}
+
+export default {
+  components: {
+    [Field.name]: Field,
+    [Popup.name]: Popup,
+    [Picker.name]: Picker,
+    FieldDatePicter
+  },
+  created() {
+    //回填
+    let id = localStorage.getItem('nbsId')
+    let state = localStorage.getItem('nbsState')
+    if (id && state) {
+      nbsDetail({
+        orderNo: id,
+        nbsState: state
+      }).then(res => {
+        let keys = Object.keys(this.form)
+        let obj = res.content
+        for (let i in obj) {
+          if (!keys.includes(i)) {
+            delete obj[i]
+          }
+        }
+
+        if (!obj.proposalNbsProjectCostInfoDTOLst) obj.proposalNbsProjectCostInfoDTOLst = [{ ...otherCost }]
+
+        this.form = obj
+        this.filterSelectedList()
+      })
+    }
+  },
+  data() {
+    return {
+      necessaryArr: necessaryDictionary.map(v => v.value),
+      targetArr: targetDictionary.map(v => v.value),
+      isNecessaryPickerShow: false,
+      clickedNecessaryIndex: null,
+      isTargetPickerShow: false,
+      clickedTargetIndex: null,
+      form: {
+        firstCostRequirements: '',
+        secondCostRequirements: '',
+        thirdCostRequirements: '',
+        livingCosts: '',
+        raisingAge: '',
+        loanBalance: '',
+        remainRepaymentTime: '',
+        charterMoney: '',
+        rentHouseNumber: '',
+        myParentsAge: '',
+        myMotherAge: '',
+        myParentsRaisemoney: '',
+        wifeParentsAge: '',
+        wifeMotherAge: '',
+        wifeParentsRaisemoney: '',
+        educationalCostOne: '',
+        educationalCostTwo: '',
+        educationalCostThree: '',
+        hospitalizationCost: '',
+        myFuneralExpenses: '',
+        wifeFuneralExpenses: '',
+        myEstimateTotalassets: '',
+        wifeEstimateTotalassets: '',
+        proposalNbsProjectCostInfoDTOLst: [{ ...otherCost }],
+        isDelete: '0'
+      }
+    }
+  },
+  methods: {
+    necessaryFieldClick(index) {
+      this.isNecessaryPickerShow = true
+      this.clickedNecessaryIndex = index
+    },
+    onNecessaryConfirm(v) {
+      this.isNecessaryPickerShow = false
+
+      let form = this.form
+      //van-picker不能传字符串数组，所以这里根据选择的项的文本，找到它的code码来保存
+      let selectedCode
+      necessaryDictionary.forEach(value => {
+        if (value.value === v) {
+          selectedCode = value.code
+        }
+      })
+      switch (this.clickedNecessaryIndex) {
+        case 1:
+          form.firstCostRequirements = selectedCode
+          break
+        case 2:
+          form.secondCostRequirements = selectedCode
+          break
+        case 3:
+          form.thirdCostRequirements = selectedCode
+          break
+      }
+
+      //已经选过的，就不能再次选了。所以每当选择时，把所有已选过的剔除出列表
+      this.filterSelectedList()
+    },
+    filterSelectedList() {
+      //已经选过的，就不能再次选了。把所有已选过的剔除出列表
+      let form = this.form
+      let selectedArr = [form.firstCostRequirements, form.secondCostRequirements, form.thirdCostRequirements]
+      let necessaryArr = []
+      necessaryDictionary.forEach(v => {
+        if (selectedArr.indexOf(v.code) === -1) {
+          necessaryArr.push(v.value)
+        }
+      })
+      this.necessaryArr = necessaryArr
+    },
+    onNecessaryCancel() {
+      this.isNecessaryPickerShow = false
+    },
+    getNecessaryText(code) {
+      for (let i of necessaryDictionary) {
+        if (i.code === code) {
+          return i.value
+        }
+      }
+    },
+    add() {
+      this.form.proposalNbsProjectCostInfoDTOLst.push({ ...otherCost })
+    },
+    del(index) {
+      this.$set(this.form.proposalNbsProjectCostInfoDTOLst, index, null)
+    },
+    dateFormatter(type, value) {
+      if (type === 'year') {
+        return `${value}年`
+      } else if (type === 'month') {
+        return `${value}月`
+      }
+      return value
+    },
+    targetFieldClick(index) {
+      this.clickedTargetIndex = index
+      this.isTargetPickerShow = true
+    },
+    getTargetText(code) {
+      for (let v of targetDictionary) {
+        if (v.code === code) {
+          return v.value
+        }
+      }
+    },
+    onTargetConfirm(v, index) {
+      this.isTargetPickerShow = false
+
+      let list = this.form.proposalNbsProjectCostInfoDTOLst,
+        value = targetDictionary[index].code
+      this.$set(list[this.clickedTargetIndex], 'object', value)
+    },
+    onTargetCancel() {
+      this.isTargetPickerShow = false
+    },
+    submit() {
+      let form = utils.deepCopy(this.form)
+      form.orderNo = localStorage.getItem('nbsId')
+      form.type = '1'
+      form.proposalNbsProjectCostInfoDTOLst = form.proposalNbsProjectCostInfoDTOLst.filter(v => v)
+      form.dateOfEntry = utils2.formatDate(new Date(), 'yyyy-MM-dd HH:mm:ss')
+      form.isDelete = '0'
+      saveForm(form).then(res => {
+        if (res.result === '0') {
+          this.$toast('保存成功')
+
+          this.$jump({
+            flag: 'h5',
+            extra: {
+              url: location.origin + `/#/nbs/nav`
+            },
+            routerInfo: {
+              path: `/nbs/nav`
+            }
+          })
+        } else {
+          this.$toast(res.resultMessage)
+        }
+      })
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+@import '../../../assets/sass/nbs';
+.necessary-container {
+  @include container;
+}
+</style>
diff --git a/src/views/ebiz/nbs/PDF.vue b/src/views/ebiz/nbs/PDF.vue
new file mode 100644
index 000000000..0d883d432
--- /dev/null
+++ b/src/views/ebiz/nbs/PDF.vue
@@ -0,0 +1,17 @@
+<template>
+  <iframe style="width:100vw;height:100vh" :src="pdfUrl"></iframe>
+</template>
+<script>
+import config from '@/config'
+export default {
+  data() {
+    return {
+      pdfUrl: ''
+    }
+  },
+  created() {
+    const pdfUrl = encodeURIComponent(config.imgDomain + '/returnDirectStream?imgPath=' + encodeURIComponent(this.$route.params.id)) //id被转换了一下，所以要转换回去
+    this.pdfUrl = location.origin + '/pdfjs/web/viewer.html?file=' + pdfUrl
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/views/ebiz/nbs/Prepared.vue b/src/views/ebiz/nbs/Prepared.vue
new file mode 100644
index 000000000..c632a8bf1
--- /dev/null
+++ b/src/views/ebiz/nbs/Prepared.vue
@@ -0,0 +1,232 @@
+<template>
+  <div class="prepared-container">
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">已投保保险</p>
+    <div v-for="(item, index) in form.proposalNbsInsuredInfoDTOLst" :key="index">
+      <template v-if="item">
+        <van-field
+          clearable
+          readonly
+          label="对象"
+          name="对象"
+          right-icon="arrow"
+          placeholder="请选择"
+          @click="targetFieldClick(index)"
+          :value="getTargetText(item.haveiNsurance)"
+        ></van-field>
+        <van-field
+          clearable
+          readonly
+          label="险种类型"
+          name="险种类型"
+          right-icon="arrow"
+          placeholder="请选择"
+          @click="insuranceFieldClick(index)"
+          :value="getInsuranceText(item.plantType)"
+        ></van-field>
+        <van-field clearable label="满期岁" name="满期岁" placeholder="请输入" :value="item.ageofMaturity" @input="ageInput(item, arguments)" :disabled="item.isLifelong"></van-field>
+        <div class="fs14 p10 flex align-center border-bt relative"><van-checkbox style="margin-left: auto;margin-right: 5px" v-model="item.isLifelong" @change="lifelongChange(item, arguments)"></van-checkbox>终身</div>
+        <van-field clearable label="保险金额（万元）" name="保险金额（万元）" placeholder="请输入" v-model="item.insuredAmount"></van-field>
+        <div class="nbs-del" @click="del(index)"><van-icon name="delete"></van-icon></div>
+      </template>
+    </div>
+    <div class="nbs-add" @click="add">+ 添加已投保保险</div>
+    <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">收入及储蓄</p>
+    <van-field clearable label="目前年收入（万元）" name="目前年收入（万元）" placeholder="请输入" v-model="form.myAnnualIncome"></van-field>
+    <van-field clearable label="预计工作至（岁）" name="预计工作至（岁）" placeholder="请输入" v-model="form.myFutureWorkinglife"></van-field>
+    <van-field clearable label="其它收入（万元/年）" name="其它收入（万元/年）" placeholder="请输入" v-model="form.myOtherRevenue"></van-field>
+    <van-field clearable label="预计可收年数（年）" name="预计可收年数（年）" placeholder="请输入" v-model="form.myOtherRevenueExpectedyear"></van-field>
+    <van-field clearable label="现有储蓄（万元）" name="现有储蓄（万元）" placeholder="请输入" v-model="form.myAssets"></van-field>
+    <van-field clearable label="配偶目前年收入（万元）" name="配偶目前年收入（万元）" placeholder="请输入" v-model="form.wifeAnnualIncome"></van-field>
+    <van-field clearable label="配偶预计工作至（岁）" name="配偶预计工作至（岁）" placeholder="请输入" v-model="form.wifeFutureWorkinglife"></van-field>
+    <van-field clearable label="配偶其它收入（万元/年）" name="配偶其它收入（万元/年）" placeholder="请输入" v-model="form.wifeOtherRevenue"></van-field>
+    <van-field
+      clearable
+      label="配偶预计可收年数（年）"
+      name="配偶预计可收年数（年）"
+      placeholder="请输入"
+      v-model="form.wifeOtherRevenueExpectedyear"
+    ></van-field>
+    <van-field clearable label="配偶现有储蓄（万元）" name="配偶现有储蓄（万元）" placeholder="请输入" v-model="form.wifeAssets"></van-field>
+    <van-button type="danger" class="bottom-btn" @click="submit" v-no-more-click="1000">完成</van-button>
+
+    <!-- 对象选择 -->
+    <van-popup v-model="isTargetPickerShow" position="bottom">
+      <van-picker show-toolbar :columns="targetArr" @confirm="onTargetConfirm" @cancel="onTargetCancel" />
+    </van-popup>
+    <!-- 险种类型选择 -->
+    <van-popup v-model="isInsurancePickerShow" position="bottom">
+      <van-picker show-toolbar :columns="insuranceArr" @confirm="onInsuranceConfirm" @cancel="onInsuranceCancel" />
+    </van-popup>
+  </div>
+</template>
+<script>
+import { Field, Popup, Picker, Checkbox } from 'vant'
+import dataDictionary from '@/assets/js/utils/data-dictionary'
+import utils from '@/assets/js/common'
+import { saveForm, nbsDetail } from '@/api/ebiz/nbs'
+import utils2 from '@/assets/js/business-common'
+
+//对象字典
+let targetDictionary = dataDictionary.targetDictionary
+//险种类型字典
+let insuranceDictionary = dataDictionary.insuranceDictionary
+
+let insuredItem = {
+  haveiNsurance: '',
+  plantType: '',
+  insuredAmount: '',
+  ageofMaturity: '',
+
+  //这两项必填写死
+  insuredinfoId: '',
+  isDelete: '0',
+
+  //不传
+  isLifelong: false
+}
+export default {
+  data() {
+    return {
+      form: {
+        proposalNbsInsuredInfoDTOLst: [{ ...insuredItem }],
+        myAnnualIncome: '',
+        myFutureWorkinglife: '',
+        myOtherRevenue: '',
+        myOtherRevenueExpectedyear: '',
+        myAssets: '',
+        wifeAnnualIncome: '',
+        wifeFutureWorkinglife: '',
+        wifeOtherRevenue: '',
+        wifeOtherRevenueExpectedyear: '',
+        wifeAssets: '',
+        isDelete: '0'
+      },
+      targetArr: targetDictionary.map(v => v.value),
+      isTargetPickerShow: false,
+      clickedTargetIndex: null,
+      insuranceArr: insuranceDictionary.map(v => v.value),
+      isInsurancePickerShow: false,
+      clickedInsurancetIndex: null
+    }
+  },
+  methods: {
+    insuranceFieldClick(index) {
+      this.clickedInsurancetIndex = index
+      this.isInsurancePickerShow = true
+    },
+    onInsuranceConfirm(value, index) {
+      let code = insuranceDictionary[index].code
+      this.$set(this.form.proposalNbsInsuredInfoDTOLst[this.clickedInsurancetIndex], 'plantType', code)
+      this.isInsurancePickerShow = false
+    },
+    onInsuranceCancel() {
+      this.isInsurancePickerShow = false
+    },
+    getInsuranceText(code) {
+      for (let v of insuranceDictionary) {
+        if (v.code === code) {
+          return v.value
+        }
+      }
+    },
+    targetFieldClick(index) {
+      this.clickedTargetIndex = index
+      this.isTargetPickerShow = true
+    },
+    onTargetConfirm(value, index) {
+      let code = targetDictionary[index].code
+      this.$set(this.form.proposalNbsInsuredInfoDTOLst[this.clickedTargetIndex], 'haveiNsurance', code)
+      this.isTargetPickerShow = false
+    },
+    onTargetCancel() {
+      this.isTargetPickerShow = false
+    },
+    getTargetText(code) {
+      for (let v of targetDictionary) {
+        if (v.code === code) {
+          return v.value
+        }
+      }
+    },
+    add() {
+      this.form.proposalNbsInsuredInfoDTOLst.push({ ...insuredItem })
+    },
+    del(index) {
+      this.$set(this.form.proposalNbsInsuredInfoDTOLst, index, null)
+    },
+    ageInput(item, args) {
+      item.ageofMaturity = args[0]
+    },
+    lifelongChange(item, args) {
+      const v = args[0]
+      item.ageofMaturity = v ? "终身" : ""
+    },
+    submit() {
+      let form = utils.deepCopy(this.form)
+      form.proposalNbsInsuredInfoDTOLst = form.proposalNbsInsuredInfoDTOLst.filter(v => v)
+      form.proposalNbsInsuredInfoDTOLst.forEach(v => delete v.isLifelong)
+      form.orderNo = localStorage.getItem('nbsId')
+      form.type = '2'
+      form.dateOfEntry = utils2.formatDate(new Date(), 'yyyy-MM-dd HH:mm:ss')
+      saveForm(form).then(res => {
+        if (res.result === '0') {
+          this.$toast('保存成功')
+
+          this.$jump({
+            flag: 'h5',
+            extra: {
+              url: location.origin + `/#/nbs/nav`
+            },
+            routerInfo: {
+              path: `/nbs/nav`
+            }
+          })
+        } else {
+          this.$toast(res.resultMessage)
+        }
+      })
+    }
+  },
+  created() {
+    //回填
+    let id = localStorage.getItem('nbsId')
+    let state = localStorage.getItem('nbsState')
+    if (id && state) {
+      nbsDetail({
+        orderNo: id,
+        nbsState: state
+      }).then(res => {
+        let keys = Object.keys(this.form)
+        let obj = res.content
+        for (let i in obj) {
+          if (!keys.includes(i)) {
+            delete obj[i]
+          }
+        }
+
+        if (!obj.proposalNbsInsuredInfoDTOLst) {
+          obj.proposalNbsInsuredInfoDTOLst = [{ ...insuredItem }]
+        } else {
+          obj.proposalNbsInsuredInfoDTOLst.forEach(v => {
+            if (v.ageofMaturity === "终身") v.isLifelong = true
+          })
+        }
+
+        this.form = obj
+      })
+    }
+  },
+  components: {
+    [Field.name]: Field,
+    [Popup.name]: Popup,
+    [Picker.name]: Picker,
+    [Checkbox.name]: Checkbox
+  }
+}
+</script>
+<style lang="scss">
+@import '../../../assets/sass/nbs';
+.prepared-container {
+  @include container;
+}
+</style>
diff --git a/src/views/ebiz/nbs/Result.vue b/src/views/ebiz/nbs/Result.vue
new file mode 100644
index 000000000..cede6c468
--- /dev/null
+++ b/src/views/ebiz/nbs/Result.vue
@@ -0,0 +1,71 @@
+<template>
+  <div>
+    <div class="mt60 text-center success-icon">
+      <van-icon name="passed"></van-icon>
+    </div>
+    <div class="mt50 fs18 text-center">报告已生成，点击查看</div>
+    <div>
+      <div class="result-button" @click="makePDF('00')">经济支柱为客户本人</div>
+      <div class="result-button" :class="{'result-button-disabled': !isHalfActive}" @click="isHalfActive && makePDF('01')">经济支柱为客户配偶</div>
+    </div>
+  </div>
+</template>
+<script>
+import { makePDF } from '@/api/ebiz/nbs'
+export default {
+  created () {
+    
+  },
+  data() {
+    return {
+      isHalfActive: this.$route.params.half === '0'
+    }
+  },
+  methods: {
+    makePDF(type) {
+      makePDF({
+        nbsState: this.$route.params.nbsState,
+        orderNo: this.$route.params.id,
+        nbsCalculusResDTO: {
+          type
+        }
+      }).then(res => {
+        let content = res.content
+        this.$jump({
+          flag: 'h5',
+          extra: {
+            url: location.origin + `/#/nbs/pdf/${content}`
+          },
+          routerInfo: {
+            path: `/nbs/pdf/${content}`
+          }
+        })
+      })
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.success-icon {
+  font-size: 100px;
+  line-height: 100px;
+  color: #7ac067;
+}
+.result-button {
+  box-sizing: border-box;
+  margin: 28px auto 0 auto;
+  width: 327px;
+  height: 40px;
+  line-height: 38px;
+  border: 1px solid #66cc00;
+  border-radius: 20px;
+  text-align: center;
+  &:first-child {
+    margin-top: 200px;
+  }
+  &-disabled {
+    color: #666;
+    border-color: #666;
+  }
+}
+</style>