| | |
| | | </div> |
| | | </div> |
| | | <div class="home_content"> |
| | | <div class="home_content_left"> |
| | | <div class="home_content_left_item" ref="picture1"></div> |
| | | <div class="home_content_left" > |
| | | <div class="home_content_left_item" v-if="userInfo.type == 0" ref="picture1"></div> |
| | | <div class="home_content_left_item" v-if="userInfo.type == 1" ref="picture4"></div> |
| | | <div class="home_content_left_item" ref="picture2"></div> |
| | | <div class="home_content_left_item" ref="picture3"></div> |
| | | <div class="home_content_left_item" v-if="userInfo.type == 0" ref="picture3"></div> |
| | | <div class="home_content_left_item" v-if="userInfo.type == 1" ref="picture6"></div> |
| | | </div> |
| | | <div class="home_content_right"> |
| | | <div class="home_content_right_label" v-if="tabs && tabs.length>0" >待办事项</div> |
| | |
| | | </el-pagination> |
| | | </div> |
| | | </div> |
| | | |
| | | <div v-if="activeName === '6'"> |
| | | <div class="home_content_right_list" v-if="tableData6 && tableData6.length"> |
| | | <div class="list_item" v-for="(item, index) in tableData6" :key="index"> |
| | |
| | | import OperaApplyChangeDetailWindow from '@/components/business/OperaApplyChangeDetailWindow' |
| | | import OperaTaxesWindow from '@/components/business/OperaTaxesWindow' |
| | | import { fetchList as noticeList, deleById } from '@/api/business/notices' |
| | | import { getChangeDetail, getDetail } from '@/api/business/insuranceApply' |
| | | import { getAddReduceData, getSettleClaimsMoney, getInsuranceNum, getInsuranceApplyStatusData, getInsuranceMemberData, getInsuranceApplyDataVO, getInsuranceApplyReportDataVO } from '@/api/business/insuranceApply' |
| | | import OperaWtbApplyShopWindow from '@/components/business/OperaWtbApplyShopWindow' |
| | | |
| | | export default { |
| | | components: { |
| | | OperaWtbApplyShopWindow, |
| | |
| | | ...mapState(['userInfo']) |
| | | }, |
| | | mounted () { |
| | | this.setPicture1() |
| | | if (this.userInfo.type == 0) { |
| | | this.setPicture1() |
| | | this.setPicture3() |
| | | } else if (this.userInfo.type == 1) { |
| | | this.setPicture4() |
| | | this.setPicture6() |
| | | } |
| | | this.setPicture2() |
| | | this.setPicture3() |
| | | this.initPanel() |
| | | this.setLoadTimer() |
| | | }, |
| | |
| | | this.$refs.OperaTaxesWindow.open('开票申请详情', { id: obj.objId }) |
| | | } else if (obj.objType === 5) { |
| | | this.$refs.operaSettleClaimsWindow.open('报案理赔详情', obj.objId) |
| | | if ([1,4, 7,13, 14, 15, 16, 17, 18].includes(obj.type)) { |
| | | if ([1, 4, 7, 13, 14, 15, 16, 17, 18].includes(obj.type)) { |
| | | // 如果是提醒累消息,删除通知 |
| | | deleById(obj.id) |
| | | .then(res => { |
| | |
| | | this.$router.push({ path: url }) |
| | | }, |
| | | setPicture1 () { |
| | | const chartDom = this.$refs.picture1 |
| | | const myChart = echarts.init(chartDom) |
| | | let option |
| | | option = { |
| | | title: { |
| | | text: '当月保险金额', |
| | | left: '5%', |
| | | top: '5%' |
| | | }, |
| | | tooltip: { |
| | | trigger: 'item' |
| | | }, |
| | | series: [ |
| | | { |
| | | type: 'pie', |
| | | radius: '50%', |
| | | data: [ |
| | | { value: 1048, name: '保障中' }, |
| | | { value: 735, name: '不在保' } |
| | | ], |
| | | emphasis: { |
| | | itemStyle: { |
| | | shadowBlur: 10, |
| | | shadowOffsetX: 0, |
| | | shadowColor: 'rgba(0, 0, 0, 0.5)' |
| | | getInsuranceNum() |
| | | .then(res => { |
| | | const chartDom = this.$refs.picture1 |
| | | const myChart = echarts.init(chartDom) |
| | | const option = { |
| | | title: { |
| | | text: '已投保单', |
| | | left: '5%', |
| | | top: '5%' |
| | | }, |
| | | legend: { |
| | | orient: 'vertical', |
| | | left: 'right', |
| | | top: '30%' |
| | | }, |
| | | tooltip: { |
| | | trigger: 'item' |
| | | }, |
| | | label: { |
| | | alignTo: 'edge', |
| | | formatter: '{b}: ({d}%)', |
| | | minMargin: 5, |
| | | edgeDistance: 10, |
| | | lineHeight: 15, |
| | | rich: { |
| | | time: { |
| | | fontSize: 10, |
| | | color: '#999' |
| | | } |
| | | } |
| | | } |
| | | }, |
| | | series: [ |
| | | { |
| | | type: 'pie', |
| | | data: [ |
| | | { value: res.zbInsuranceNum || 0, name: '直保' }, |
| | | { value: res.wtbInsuranceNum || 0, name: '委托投保' } |
| | | ], |
| | | radius: ['30%', '50%'], |
| | | avoidLabelOverlap: false, |
| | | emphasis: { |
| | | itemStyle: { |
| | | shadowBlur: 10, |
| | | shadowOffsetX: 0, |
| | | shadowColor: 'rgba(0, 0, 0, 0.5)' |
| | | } |
| | | } |
| | | } |
| | | ] |
| | | } |
| | | ] |
| | | } |
| | | |
| | | option && myChart.setOption(option) |
| | | option && myChart.setOption(option) |
| | | }) |
| | | }, |
| | | setPicture4 () { |
| | | getInsuranceApplyStatusData() |
| | | .then(res => { |
| | | const chartDom = this.$refs.picture4 |
| | | const myChart = echarts.init(chartDom) |
| | | var yd = [] |
| | | if (res && res.length > 0) { |
| | | res.forEach(item => { |
| | | yd.push({ name: item.dataFirst, value: item.dataSecond || 0 }) |
| | | }) |
| | | } |
| | | const option = { |
| | | title: { |
| | | text: '已投保单各状态占比', |
| | | left: '5%', |
| | | top: '5%' |
| | | }, |
| | | legend: { |
| | | orient: 'vertical', |
| | | left: 'right', |
| | | top: '30%' |
| | | }, |
| | | tooltip: { |
| | | trigger: 'item' |
| | | }, |
| | | label: { |
| | | alignTo: 'edge', |
| | | formatter: '{b}: ({c}个)', |
| | | minMargin: 5, |
| | | edgeDistance: 10, |
| | | lineHeight: 15, |
| | | rich: { |
| | | time: { |
| | | fontSize: 10, |
| | | color: '#999' |
| | | } |
| | | } |
| | | }, |
| | | series: [ |
| | | { |
| | | type: 'pie', |
| | | data: yd, |
| | | radius: ['30%', '50%'], |
| | | avoidLabelOverlap: false, |
| | | emphasis: { |
| | | itemStyle: { |
| | | shadowBlur: 10, |
| | | shadowOffsetX: 0, |
| | | shadowColor: 'rgba(0, 0, 0, 0.5)' |
| | | } |
| | | } |
| | | } |
| | | ] |
| | | } |
| | | |
| | | option && myChart.setOption(option) |
| | | }) |
| | | }, |
| | | setPicture6 () { |
| | | getInsuranceMemberData() |
| | | .then(res => { |
| | | const chartDom = this.$refs.picture6 |
| | | const myChart = echarts.init(chartDom) |
| | | var yd = [] |
| | | if (res && res.length > 0) { |
| | | res.forEach(item => { |
| | | yd.push({ name: item.dataFirst, value: item.dataSecond || 0 }) |
| | | }) |
| | | } |
| | | const option = { |
| | | title: { |
| | | text: '在保员工', |
| | | left: '5%', |
| | | top: '5%' |
| | | }, |
| | | grid: { |
| | | left: '3%', |
| | | right: '3%', |
| | | top: '25%', |
| | | bottom: '0%', |
| | | containLabel: true |
| | | }, |
| | | legend: { |
| | | orient: 'vertical', |
| | | left: 'right', |
| | | top: '30%' |
| | | }, |
| | | tooltip: { |
| | | trigger: 'item' |
| | | }, |
| | | label: { |
| | | alignTo: 'edge', |
| | | formatter: '{b}: ({c}人)', |
| | | minMargin: 5, |
| | | edgeDistance: 10, |
| | | lineHeight: 15, |
| | | rich: { |
| | | time: { |
| | | fontSize: 10, |
| | | color: '#999' |
| | | } |
| | | } |
| | | }, |
| | | series: [ |
| | | { |
| | | type: 'pie', |
| | | data: yd, |
| | | radius: ['30%', '50%'], |
| | | avoidLabelOverlap: false, |
| | | emphasis: { |
| | | itemStyle: { |
| | | shadowBlur: 10, |
| | | shadowOffsetX: 0, |
| | | shadowColor: 'rgba(0, 0, 0, 0.5)' |
| | | } |
| | | } |
| | | } |
| | | ] |
| | | } |
| | | |
| | | option && myChart.setOption(option) |
| | | }) |
| | | }, |
| | | setPicture2 () { |
| | | const chartDom = this.$refs.picture2 |
| | | const myChart = echarts.init(chartDom) |
| | | let option |
| | | option = { |
| | | title: { |
| | | text: '当月在保人数', |
| | | left: '5%', |
| | | top: '5%' |
| | | }, |
| | | grid: { |
| | | left: '3%', |
| | | right: '4%', |
| | | bottom: '13%', |
| | | containLabel: true |
| | | }, |
| | | tooltip: { |
| | | trigger: 'axis' |
| | | }, |
| | | xAxis: { |
| | | type: 'category', |
| | | data: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'] |
| | | }, |
| | | yAxis: { |
| | | type: 'value' |
| | | }, |
| | | series: [ |
| | | { |
| | | data: [10, 30, 25, 16, 21, 18, 5, 30, 30, 30, 30, 30], |
| | | type: 'line' |
| | | getAddReduceData() |
| | | .then(res => { |
| | | var xd = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'] |
| | | var yd = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0] |
| | | var yd1 = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0] |
| | | if (res && res.length > 0) { |
| | | xd = [] |
| | | yd = [] |
| | | yd1 = [] |
| | | res.forEach(item => { |
| | | xd.push(item.dataFirst) |
| | | yd.push(item.dataSecond) |
| | | yd1.push(item.dataThird) |
| | | }) |
| | | } |
| | | ] |
| | | } |
| | | const chartDom = this.$refs.picture2 |
| | | const myChart = echarts.init(chartDom) |
| | | const option = { |
| | | title: { |
| | | text: '每月加减保人数', |
| | | left: '5%', |
| | | top: '1%' |
| | | }, |
| | | grid: { |
| | | left: '3%', |
| | | right: '3%', |
| | | top: '25%', |
| | | bottom: '0%', |
| | | containLabel: true |
| | | }, |
| | | tooltip: { |
| | | trigger: 'axis', |
| | | axisPointer: { |
| | | type: 'shadow' |
| | | } |
| | | }, |
| | | legend: { |
| | | top: '5%', |
| | | left: 'right' |
| | | }, |
| | | xAxis: { |
| | | type: 'category', |
| | | // boundaryGap: false, |
| | | data: xd |
| | | }, |
| | | yAxis: { |
| | | type: 'value' |
| | | }, |
| | | series: [ |
| | | { |
| | | name: '加保', |
| | | data: yd, |
| | | type: 'bar', |
| | | areaStyle: { |
| | | opacity: 0.5, |
| | | color: '#f07e6f' |
| | | }, |
| | | lineStyle: { |
| | | color: '#f07e6f' |
| | | } |
| | | }, |
| | | { |
| | | name: '减保', |
| | | data: yd1, |
| | | type: 'bar', |
| | | areaStyle: { |
| | | opacity: 0.5, |
| | | color: '#f07e6f' |
| | | }, |
| | | lineStyle: { |
| | | color: '#f07e6f' |
| | | } |
| | | } |
| | | ] |
| | | } |
| | | option && myChart.setOption(option) |
| | | |
| | | option && myChart.setOption(option) |
| | | console.log(res) |
| | | }) |
| | | }, |
| | | setPicture3 () { |
| | | const chartDom = this.$refs.picture3 |
| | | const myChart = echarts.init(chartDom) |
| | | let option |
| | | option = { |
| | | title: { |
| | | text: '总赔付率 78%', |
| | | left: '5%', |
| | | top: '5%' |
| | | }, |
| | | tooltip: { |
| | | trigger: 'axis', |
| | | axisPointer: { |
| | | type: 'shadow' |
| | | getSettleClaimsMoney() |
| | | .then(res => { |
| | | var xd = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'] |
| | | var yd = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0] |
| | | if (res && res.length > 0) { |
| | | xd = [] |
| | | yd = [] |
| | | res.forEach(item => { |
| | | xd.push(item.dataFirst) |
| | | yd.push(item.dataSecond) |
| | | }) |
| | | } |
| | | }, |
| | | grid: { |
| | | left: '3%', |
| | | right: '4%', |
| | | bottom: '25%', |
| | | containLabel: true |
| | | }, |
| | | xAxis: { |
| | | type: 'value' |
| | | // boundaryGap: [0, 0.01] |
| | | }, |
| | | yAxis: { |
| | | type: 'category', |
| | | data: ['保险A赔付率', '保险B赔付率', '总赔付率'] |
| | | }, |
| | | series: [ |
| | | { |
| | | type: 'bar', |
| | | stack: 'total', |
| | | barWidth: '60%', |
| | | data: [10, 20, 30] |
| | | }, |
| | | { |
| | | type: 'bar', |
| | | stack: 'total', |
| | | barWidth: '60%', |
| | | data: [15, 16, 24] |
| | | const chartDom = this.$refs.picture3 |
| | | const myChart = echarts.init(chartDom) |
| | | const option = { |
| | | title: { |
| | | text: '每月赔付金额', |
| | | left: '5%', |
| | | top: '5%' |
| | | }, |
| | | grid: { |
| | | left: '3%', |
| | | right: '3%', |
| | | top: '25%', |
| | | bottom: '0%', |
| | | containLabel: true |
| | | }, |
| | | tooltip: { |
| | | trigger: 'axis', |
| | | axisPointer: { |
| | | type: 'shadow' |
| | | } |
| | | }, |
| | | legend: { |
| | | top: '5%', |
| | | left: 'right' |
| | | }, |
| | | xAxis: { |
| | | type: 'category', |
| | | // boundaryGap: false, |
| | | data: xd |
| | | }, |
| | | yAxis: { |
| | | type: 'value' |
| | | }, |
| | | series: [ |
| | | { |
| | | data: yd, |
| | | type: 'line', |
| | | smooth: true, |
| | | areaStyle: { |
| | | opacity: 0.5, |
| | | color: '#f07e6f' |
| | | }, |
| | | lineStyle: { |
| | | color: '#f07e6f' |
| | | } |
| | | } |
| | | ] |
| | | } |
| | | ] |
| | | } |
| | | option && myChart.setOption(option) |
| | | |
| | | option && myChart.setOption(option) |
| | | console.log(res) |
| | | }) |
| | | } |
| | | } |
| | | } |
| | |
| | | /*justify-content: space-between;*/ |
| | | .home_content_left { |
| | | width: 350px; |
| | | |
| | | /*height: 100%;*/ |
| | | height: auto; |
| | | flex-shrink: 0; |