From a01a51810903a6d20e16f80106c564173f1cbfc2 Mon Sep 17 00:00:00 2001
From: anbbukn <anbbukn2@foxmail.com>
Date: Tue, 30 Jun 2020 22:34:31 +0800
Subject: [PATCH] =?UTF-8?q?[Fix]=20=E3=80=90nbs=E5=86=85=E5=8B=A4=E3=80=91?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E8=A1=A5=E5=85=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ebiz/nbs/InternalList.vue   |  96 +++++++++++++++
 src/components/ebiz/nbs/InternalNav.vue    |  62 ++++++++++
 src/views/ebiz/nbs/InternalService.vue     | 136 +++++++++++++++++++++
 src/views/ebiz/nbs/InternalServiceItem.vue |  94 ++++++++++++++
 4 files changed, 388 insertions(+)
 create mode 100644 src/components/ebiz/nbs/InternalList.vue
 create mode 100644 src/components/ebiz/nbs/InternalNav.vue
 create mode 100644 src/views/ebiz/nbs/InternalService.vue
 create mode 100644 src/views/ebiz/nbs/InternalServiceItem.vue

diff --git a/src/components/ebiz/nbs/InternalList.vue b/src/components/ebiz/nbs/InternalList.vue
new file mode 100644
index 000000000..3326164e7
--- /dev/null
+++ b/src/components/ebiz/nbs/InternalList.vue
@@ -0,0 +1,96 @@
+<template>
+  <div class="list">
+    <div class="loading" v-if="!dataLoading || dataLoading.toString() === ''">
+      <van-loading />
+    </div>
+    <ul v-else>
+      <li v-for="(item, i) in list" :key="i">
+        <div class="left">{{ item.name }}</div>
+        <div class="right" @click="toItem_2(item.code, item.name)">
+          <div class="content">生成报告：{{ item.value }}</div>
+          <i v-if="level !== '3'">&gt;</i>
+        </div>
+      </li>
+    </ul>
+  </div>
+</template>
+<script>
+import { Loading } from 'vant'
+export default {
+  name: 'unit-list',
+  props: {
+    list: {
+      type: Array,
+      default: () => []
+    },
+    url: {
+      type: String,
+      default: ''
+    },
+    level: {
+      type: String,
+      default: '1'
+    },
+    type: {
+      type: String
+    },
+    dataLoading: {
+      type: Array
+    }
+  },
+  components: {
+    [Loading.name]: Loading
+  },
+  methods: {
+    toItem_2(code, name) {
+      if (this.level === '3') return
+      if (this.level === '1') this.$store.commit('setSecondManageCode', code)
+      else if (this.level === '2') this.$store.commit('setThirdManageCode', code)
+      this.$jump({
+        flag: 'h5',
+        extra: {
+          url: `${location.origin + this.url}?name=${encodeURIComponent(name)}`
+          //   forbidSwipeBack: '1',
+          //   needRefresh: '1'
+        },
+        routerInfo: { path: `${this.url}?name=${encodeURIComponent(name)}` }
+      })
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.list {
+  .loading {
+    padding-top: 100px;
+    display: flex;
+    justify-content: center;
+  }
+  li {
+    padding: 10px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    font-size: 14px;
+    border-bottom: 1px solid #eee;
+    .left {
+      width: 240px;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+      overflow: hidden;
+      word-break: break-all;
+    }
+    .right {
+      display: flex;
+      align-items: center;
+      .content {
+        color: #ff0000;
+      }
+      i {
+        color: #999;
+        padding-left: 5px;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/components/ebiz/nbs/InternalNav.vue b/src/components/ebiz/nbs/InternalNav.vue
new file mode 100644
index 000000000..cfcff528d
--- /dev/null
+++ b/src/components/ebiz/nbs/InternalNav.vue
@@ -0,0 +1,62 @@
+<template>
+  <div class="nav" ref="nav">
+    <div>国富人寿总公司</div>
+    <div v-for="(item, i) in titleArr" :key="i"><span>&gt;</span>{{ item }}</div>
+    <div class="right" v-if="titleArr.toString() === ''">
+      <div>生成报告：{{ total }}</div>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'unit-nav',
+  props: {
+    titleArr: {
+      type: Array,
+      default: () => []
+    },
+    total: {
+      type: Number,
+      default: 0
+    }
+  },
+  mounted() {
+    this.$refs.nav.scrollLeft = 10000
+  }
+}
+</script>
+<style lang="scss" scoped>
+.nav {
+  display: flex;
+  overflow-x: auto;
+  align-items: center;
+  height: 40px;
+  border-bottom: 1px solid #eee;
+  div {
+    &:first-child {
+      padding-left: 10px;
+    }
+    &:last-child {
+      padding-right: 10px;
+    }
+    &.right {
+      width: 1000px;
+      position: relative;
+      div {
+        position: absolute;
+        color: #f00;
+        right: 0;
+        top: 50%;
+        transform: translateY(-50%);
+      }
+    }
+    &:not(.right) {
+      flex-shrink: 0;
+    }
+    font-size: 13px;
+    span {
+      padding: 0 3px;
+    }
+  }
+}
+</style>
diff --git a/src/views/ebiz/nbs/InternalService.vue b/src/views/ebiz/nbs/InternalService.vue
new file mode 100644
index 000000000..8db3d9f39
--- /dev/null
+++ b/src/views/ebiz/nbs/InternalService.vue
@@ -0,0 +1,136 @@
+<template>
+  <div class="internal-container">
+    <van-sticky>
+      <div class="title">
+        <div class="left">
+          <van-button round type="info" size="mini" @click="setDateType(1)" :class="{ default: 1, checked: params.dateType === 1 }">今日</van-button>
+          <van-button round type="info" size="mini" @click="setDateType(2)" :class="{ default: 1, checked: params.dateType === 2 }">当月</van-button>
+        </div>
+        <div class="right" @click="showTimeSelector">
+          <span>选择日期</span>
+          <van-icon name="calender-o" size="4.73333vw" />
+        </div>
+      </div>
+      <unit-nav :total="tableData.total"></unit-nav>
+    </van-sticky>
+    <unit-list v-if="tableData" level="1" :dataLoading="tableData.list" :list="tableData.list" url="/nbs/internalItem"></unit-list>
+    <van-popup v-model="showTime" position="bottom">
+      <van-datetime-picker
+        v-model="currentDate"
+        type="date"
+        title="选择年月日"
+        :min-date="minDate"
+        :max-date="maxDate"
+        @confirm="setDateType"
+        @cancel="showTimeSelector"
+      />
+    </van-popup>
+  </div>
+</template>
+<script>
+import { Sticky, Popup, Picker, DatetimePicker } from 'vant'
+import { getTableList } from '@/api/ebiz/nbs'
+import InternalNav from '@/components/ebiz/nbs/InternalNav'
+import InternalList from '@/components/ebiz/nbs/InternalList'
+export default {
+  name: 'internal',
+  components: {
+    [Sticky.name]: Sticky,
+    [Popup.name]: Popup,
+    [Picker.name]: Picker,
+    [DatetimePicker.name]: DatetimePicker,
+    [InternalNav.name]: InternalNav,
+    [InternalList.name]: InternalList
+  },
+  data() {
+    return {
+      params: {
+        dateType: '1999-06-28T16:00:00.000Z'
+      },
+      topTableLeft: '',
+      minDate: new Date('1999/01/01'),
+      maxDate: new Date(`${new Date().getFullYear() + 5}/12/31`),
+      currentDate: new Date(),
+      showTime: false,
+      tableData: {
+        list: [],
+        total: 0
+      }
+    }
+  },
+  methods: {
+    setDateType(type) {
+      this.params.dateType = type
+      this.showTime = false
+      this.tableData = {}
+      this.getDataList()
+    },
+    showTimeSelector() {
+      this.showTime = !this.showTime
+    },
+    async getDataList() {
+      const rs = await getTableList({
+        startTime: this.params.dateType,
+        pageSize: 0,
+        pageNum: 0
+      })
+      console.log(rs)
+      let arr = [],
+        num = 0
+      for (let key in rs.content) {
+        if (key !== 'total') {
+          for (let cKey in rs.content[key]) {
+            num += rs.content[key][cKey]
+            arr.push({
+              code: key,
+              value: rs.content[key][cKey],
+              name: cKey
+            })
+          }
+        }
+      }
+      this.tableData.total = num
+      this.tableData.list = arr
+      console.log(this.tableData)
+    }
+  },
+  created() {
+    this.getDataList()
+  }
+}
+</script>
+<style scoped lang="scss">
+.title {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  height: 40px;
+  border: 1px solid #eee;
+  border-left: 0;
+  border-right: 0;
+  padding: 0 10px;
+  .left {
+    /deep/ button:nth-child(1) {
+      margin-right: 10px;
+    }
+    .default {
+      background: transparent;
+      color: #999;
+      border-color: #999;
+      &.checked {
+        background: #e4393c;
+        border-color: #e4393c;
+        color: #fff;
+      }
+    }
+  }
+  .right {
+    font-size: 14px;
+    display: flex;
+    align-items: center;
+    span {
+      padding-right: 5px;
+    }
+  }
+}
+</style>
diff --git a/src/views/ebiz/nbs/InternalServiceItem.vue b/src/views/ebiz/nbs/InternalServiceItem.vue
new file mode 100644
index 000000000..ab4fa8c1f
--- /dev/null
+++ b/src/views/ebiz/nbs/InternalServiceItem.vue
@@ -0,0 +1,94 @@
+<template>
+  <div class="item-container">
+    <van-sticky>
+      <div class="title">
+        <van-search background="transparent" v-model="searchVal" placeholder="请输入搜索关键词" />
+      </div>
+      <unit-nav :titleArr="titleArr" :key="changeKey"></unit-nav>
+    </van-sticky>
+    <unit-list v-if="tableData" :list="searchList" :dataLoading="tableData.list" :level="level" url="/nbs/internalItem_2"></unit-list>
+  </div>
+</template>
+<script>
+import { Sticky, Popup, Picker, DatetimePicker, Search } from 'vant'
+import { getTableList } from '@/api/ebiz/nbs'
+import InternalNav from '@/components/ebiz/nbs/InternalNav'
+import InternalList from '@/components/ebiz/nbs/InternalList'
+export default {
+  name: 'item',
+  components: {
+    [Search.name]: Search,
+    [Sticky.name]: Sticky,
+    [Popup.name]: Popup,
+    [Picker.name]: Picker,
+    [DatetimePicker.name]: DatetimePicker,
+    [InternalNav.name]: InternalNav,
+    [InternalList.name]: InternalList
+  },
+  watch: {
+    '$route.path'(n) {
+      if (n.includes('/nbs/internalItem_2')) {
+        this.level = '3'
+        this.titleArr.push(decodeURIComponent(this.$route.query.name))
+      } else {
+        this.level = '2'
+        if (this.titleArr.length === 2) this.titleArr.pop()
+      }
+      this.tableData = {}
+      this.searchVal = ''
+      this.searchList = []
+      this.getDataList()
+      this.changeKey = this.changeKey === 1 ? 2 : 1
+    },
+    searchVal(n) {
+      if (this.tableData.list)
+        this.searchList = this.tableData.list.filter(item => {
+          return item.name.includes(n)
+        })
+    }
+  },
+  data() {
+    return {
+      changeKey: 1,
+      tableData: {
+        list: []
+      },
+      searchList: [],
+      titleArr: [],
+      level: '2',
+      searchVal: ''
+    }
+  },
+  methods: {
+    async getDataList() {
+      const data = {
+        pageSize: 0,
+        pageNum: 0,
+        secondManageCode: this.$store.state.secondManageCode
+      }
+      if (this.level === '2') delete data.thirdManageCode
+      else data.thirdManageCode = this.$store.state.thirdManageCode
+      const rs = await getTableList(data)
+      let arr = []
+      for (let key in rs.content) {
+        if (key !== 'total') {
+          for (let cKey in rs.content[key]) {
+            arr.push({
+              code: key,
+              value: rs.content[key][cKey],
+              name: cKey
+            })
+          }
+        } else this.$set(this.tableData, 'total', rs.content[key])
+      }
+      this.tableData.list = arr
+      this.searchList = [...arr]
+    }
+  },
+  created() {
+    this.getDataList()
+    this.titleArr = [decodeURIComponent(this.$route.query.name)]
+  }
+}
+</script>
+<style lang="scss" scoped></style>