mirror of
http://112.124.100.131/GFRS/ebiz-h5.git
synced 2025-12-11 07:26:44 +08:00
[Fix] 【nbs内勤】页面补充
This commit is contained in:
anbbukn
96
src/components/ebiz/nbs/InternalList.vue
Normal file
96
src/components/ebiz/nbs/InternalList.vue
Normal file
@@ -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'">></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>
|
||||
62
src/components/ebiz/nbs/InternalNav.vue
Normal file
62
src/components/ebiz/nbs/InternalNav.vue
Normal file
@@ -0,0 +1,62 @@
|
||||
<template>
|
||||
<div class="nav" ref="nav">
|
||||
<div>国富人寿总公司</div>
|
||||
<div v-for="(item, i) in titleArr" :key="i"><span>></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>
|
||||
136
src/views/ebiz/nbs/InternalService.vue
Normal file
136
src/views/ebiz/nbs/InternalService.vue
Normal file
@@ -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>
|
||||
94
src/views/ebiz/nbs/InternalServiceItem.vue
Normal file
94
src/views/ebiz/nbs/InternalServiceItem.vue
Normal file
@@ -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>
|
||||
Reference in New Issue
Block a user