mirror of
http://112.124.100.131/GFRS/ebiz-h5.git
synced 2025-12-08 18:46:43 +08:00
1052 lines
33 KiB
Vue
1052 lines
33 KiB
Vue
<template>
|
||
<div style="background: #fff;height: 100vh">
|
||
<div class="search_col">
|
||
<div class="topBox">
|
||
<div class="shouButton" @click="openPopup">
|
||
<van-button size="small">
|
||
{{ outOrderType === 'accept' ? '承保' : '预收' }}
|
||
<van-icon size="12" name="arrow-down" />
|
||
</van-button>
|
||
</div>
|
||
<div class="group" @click="openPopup">
|
||
<van-button size="small">
|
||
{{ titleText }}
|
||
<van-icon size="12" name="arrow-down" />
|
||
</van-button>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<!-- <div class="group" @click="openPopup">
|
||
<van-radio-group class="groups" v-model="dateFlag" direction="horizontal" @change="queryOutOrderListFunc">
|
||
<van-radio name="all">
|
||
<template #icon="props">
|
||
<van-button size="small" :class="props.checked ? 'checked' : ''">全部</van-button>
|
||
</template>
|
||
</van-radio>
|
||
<van-radio name="m">
|
||
<template #icon="props">
|
||
<van-button size="small" :class="props.checked ? 'checked' : ''">最近一月</van-button>
|
||
</template>
|
||
</van-radio>
|
||
<van-radio name="y">
|
||
<template #icon="props">
|
||
<van-button size="small" :class="props.checked ? 'checked' : ''">最近一年</van-button>
|
||
</template>
|
||
</van-radio>
|
||
</van-radio-group>
|
||
<button class="titlebtn">{{ titleText }}</button>
|
||
<van-icon size="12" name="arrow-down" />
|
||
|
||
</div> -->
|
||
<div class="icon">
|
||
<van-icon name="filter-o" @click="openPopup" />
|
||
</div>
|
||
</div>
|
||
|
||
<div class="classification">
|
||
<span>机构名称: </span>
|
||
<!-- <span v-if="manageLv == '06' || manageLv == '07' || manageLv == '08'">
|
||
<span>{{ OrgLv2Name }}</span>
|
||
<van-icon name="arrow" />
|
||
</span>
|
||
<span v-else-if="manageLv == '04' || manageLv == '05'" @click="isOrgLv2ConditionShow = true">
|
||
<span>{{ OrgLv2Name }}</span>
|
||
<van-icon name="arrow-down" />
|
||
</span>-->
|
||
|
||
<template>
|
||
<!-- <span v-if="!isJzg" style="margin-right: 10px">
|
||
<span>{{ OrgLvName }}</span>
|
||
</span> -->
|
||
<span @click="isOrgLv2ConditionShow = true">
|
||
<span>{{ OrgLv2Name }}</span>
|
||
<van-icon size="12" name="arrow-down" />
|
||
</span>
|
||
<span @click="isOrgLv3ConditionShow = true">
|
||
<span>{{ OrgLv3Name }}</span>
|
||
<van-icon size="12" name="arrow-down" />
|
||
</span>
|
||
|
||
<span @click="isOrgLv4ConditionShow = true">
|
||
<span>{{ OrgLv4Name }}</span>
|
||
<van-icon size="12" name="arrow-down" />
|
||
</span>
|
||
</template>
|
||
</div>
|
||
<!-- <div class="filterDate">-->
|
||
<!-- <div class="filterTime">-->
|
||
<!-- <!– <van-field-->
|
||
<!-- :value="filterDate"-->
|
||
<!-- readonly-->
|
||
<!-- label=""-->
|
||
<!-- name=""-->
|
||
<!-- right-icon="arrow"-->
|
||
<!-- placeholder="时间筛选"-->
|
||
<!-- v-validate="'required'"-->
|
||
<!-- @click="toSelect('8')"-->
|
||
<!-- /> –>-->
|
||
<!-- <FieldDatePicter-->
|
||
<!-- label=""-->
|
||
<!-- name=""-->
|
||
<!-- :isDefault="true"-->
|
||
<!-- :value.sync="filterDate"-->
|
||
<!-- type="year-month"-->
|
||
<!-- :flag="true"-->
|
||
<!-- :defaultStyle="style02"-->
|
||
<!-- placeholder="时间筛选"-->
|
||
<!-- @confirm="onDateConfirm($event, '2')"-->
|
||
<!-- :maxDate="maxDate"-->
|
||
<!-- ></FieldDatePicter>-->
|
||
<!-- </div>-->
|
||
<!--<!– <div class="number">–>-->
|
||
<!--<!– <van-button type="danger" @click="switchDayOrMonth(0)" :plain="currentIndex == 0 ? true : false" size="small">当月</van-button>–>-->
|
||
<!--<!– <van-button type="danger" @click="switchDayOrMonth(1)" :plain="currentIndex == 1 ? true : false" size="small">当天</van-button>–>-->
|
||
<!--<!– </div>–>-->
|
||
<!-- </div>-->
|
||
<div class="table" v-if="listShow">
|
||
<!-- <van-list v-model="loading" :finished="finished" @load="queryOutOrderListFunc" :immediate-check="false" finished-text="没有更多数据了">-->
|
||
<tableDetail2
|
||
:theads="theads"
|
||
:tableData="tableData"
|
||
:total="total"
|
||
:page-size="pageSize"
|
||
:page-num="pageNum"
|
||
@currentChange="currentChange"
|
||
@from-child="double_click"
|
||
@fro-child="xiangqing"
|
||
></tableDetail2>
|
||
<!-- </van-list>-->
|
||
</div>
|
||
<p v-else class="noList">当前条件查无数据</p>
|
||
|
||
<!-- 二级机构筛选栏 -->
|
||
<van-popup v-model="isOrgLv2ConditionShow" position="bottom" :style="{ height: '40vh' }">
|
||
<van-picker show-toolbar :columns="province" @confirm="onOrgLv2ConditionConfirm" @cancel="isOrgLv2ConditionShow = false" />
|
||
</van-popup>
|
||
<!-- 三级机构筛选栏 -->
|
||
<van-popup v-model="isOrgLv3ConditionShow" position="bottom" :style="{ height: '40vh' }">
|
||
<van-picker show-toolbar :columns="city" @confirm="onOrgLv3ConditionConfirm" @cancel="isOrgLv3ConditionShow = false" />
|
||
</van-popup>
|
||
<!-- 四级机构筛选栏 -->
|
||
<van-popup v-model="isOrgLv4ConditionShow" position="bottom" :style="{ height: '40vh' }">
|
||
<van-picker show-toolbar :columns="area" @confirm="onOrgLv4ConditionConfirm" @cancel="isOrgLv4ConditionShow = false" />
|
||
</van-popup>
|
||
|
||
<van-popup v-model="show" position="right" :style="{ width: '80%', height: '100%' }">
|
||
<div class="content">
|
||
<h3>全部筛选</h3>
|
||
<div style="margin-top: 10px">
|
||
<div>时间</div>
|
||
<div class="button_times">
|
||
<!-- <van-button size="small" :class="dialogForm.dateFlag === 'all' ? 'checked' : ''" @click="typeCheck('all')">全部</van-button> -->
|
||
<van-button size="small" :class="dialogForm.dateFlag === 'm' ? 'checked' : ''" @click="typeCheck('m')">按月份查询</van-button>
|
||
<van-button size="small" :class="dialogForm.dateFlag === 'y' ? 'checked' : ''" @click="typeCheck('y')">按时间范围查询</van-button>
|
||
</div>
|
||
<div v-if="dialogForm.dateFlag === 'm'" style="display: flex; align-items: center; justify-content: space-between; justify-items: center; margin-top: 20px">
|
||
<p @click="typeCheck('m')">当前选择月份: {{ monthValue }}</p>
|
||
|
||
</div>
|
||
<div v-if="dialogForm.dateFlag === 'y'" style="display: flex; align-items: center; justify-content: space-between; justify-items: center; margin-top: 20px">
|
||
<van-field
|
||
@click="openTime('startDate')"
|
||
class="timeField"
|
||
v-model="dialogForm.startDate"
|
||
readonly
|
||
label=""
|
||
name=""
|
||
right-icon="arrow"
|
||
placeholder="开始日期"
|
||
>
|
||
<template #right-icon>
|
||
<div style="display: flex">
|
||
<svg
|
||
t="1727160320493"
|
||
class="icon"
|
||
viewBox="0 0 1024 1024"
|
||
version="1.1"
|
||
xmlns="http://www.w3.org/2000/svg"
|
||
p-id="2391"
|
||
width="20"
|
||
height="20"
|
||
>
|
||
<path
|
||
d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32z m-40 656H184V460h656v380zM184 392V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v136H184z"
|
||
p-id="2392"
|
||
></path>
|
||
</svg>
|
||
</div>
|
||
</template>
|
||
</van-field>
|
||
<div>-</div>
|
||
<van-field
|
||
@click="openTime('endDate')"
|
||
class="timeField"
|
||
v-model="dialogForm.endDate"
|
||
label=""
|
||
name=""
|
||
right-icon="icon-calendar"
|
||
placeholder="结束日期"
|
||
>
|
||
<template #right-icon>
|
||
<div style="display: flex">
|
||
<svg
|
||
t="1727160320493"
|
||
class="icon"
|
||
viewBox="0 0 1024 1024"
|
||
version="1.1"
|
||
xmlns="http://www.w3.org/2000/svg"
|
||
p-id="2391"
|
||
width="20"
|
||
height="20"
|
||
>
|
||
<path
|
||
d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32z m-40 656H184V460h656v380zM184 392V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v136H184z"
|
||
p-id="2392"
|
||
></path>
|
||
</svg>
|
||
</div>
|
||
</template>
|
||
</van-field>
|
||
</div>
|
||
</div>
|
||
<div style="margin-top: 10px">
|
||
<div>出单类型</div>
|
||
<div style="margin-top: 10px">
|
||
<van-button size="small" :class="dialogForm.outOrderType === 'accept' ? 'checked' : ''" @click="dialogForm.outOrderType = 'accept'"
|
||
>承保</van-button
|
||
>
|
||
<van-button
|
||
size="small"
|
||
:class="dialogForm.outOrderType === 'advance' ? 'checked' : ''"
|
||
@click="dialogForm.outOrderType = 'advance'"
|
||
style="margin-left: 10px"
|
||
>预收</van-button
|
||
>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="button_bottom">
|
||
<van-button size="" @click="show = false" style="color: #ee3030">取消</van-button>
|
||
<van-button size="" type="danger" @click="popupOnConfirm">确定</van-button>
|
||
</div>
|
||
</van-popup>
|
||
<van-popup v-model="timeShow" position="bottom" :style="{ height: '40vh' }">
|
||
<van-datetime-picker
|
||
v-model="currentDate"
|
||
type="date"
|
||
title="选择年月日"
|
||
@confirm="timeConfirm"
|
||
@cancel="timeCancel"
|
||
:min-date="timeMinDate"
|
||
:max-date="timeMaxDate"
|
||
/>
|
||
</van-popup>
|
||
<van-popup v-model="overlayShow" position="bottom" round>
|
||
<van-datetime-picker
|
||
title="请选择月份"
|
||
v-model="currentDate"
|
||
type="year-month"
|
||
:min-date="minDate"
|
||
:max-date="maxDate"
|
||
:formatter="formatter"
|
||
@confirm="confirmChange"
|
||
@cancel="cancelChange"
|
||
/>
|
||
</van-popup>
|
||
<div class="hebao" v-if="hebaoShow">
|
||
<generateImg
|
||
@child-colse="closeHebao"
|
||
></generateImg>
|
||
</div>
|
||
<van-popup v-model="xiangqingShow" position="right" :style="{ width: '100%', height: '100%' }">
|
||
<policyDetails
|
||
v-if="xiangqingShow"
|
||
:orderNo="orderNo"
|
||
@child-back="closeDetails"
|
||
>
|
||
</policyDetails>
|
||
</van-popup>
|
||
<!-- <div class="xiangqing" v-if="xiangqingShow" >
|
||
|
||
</div> -->
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { Icon, RadioGroup, Radio, DatetimePicker, Toast } from 'vant'
|
||
import tableDetail2 from '@/components/ebiz/billingDetail/tableDetail2'
|
||
import generateImg from '../generateImg/generateImg.vue'
|
||
import policyDetails from './policyDetails.vue'
|
||
import { getMisBranchComList2 } from '@/api/ebiz/branchOffice/branchOffice'
|
||
import FieldDatePicter from '@/components/ebiz/FieldDatePicter'
|
||
import { queryOutOrderList, getBranchByUser } from '@/api/ebiz/billingDetail/billingDetail'
|
||
import { getAgentInfo } from '@/api/ebiz/my/my'
|
||
import { isNumber } from 'vant/lib/utils/validate/number'
|
||
// 当前时间
|
||
const currentDate = new Date()
|
||
export default {
|
||
name: 'billingDetail',
|
||
components: {
|
||
tableDetail2,
|
||
generateImg,
|
||
policyDetails,
|
||
[Icon.name]: Icon,
|
||
[RadioGroup.name]: RadioGroup,
|
||
[Radio.name]: Radio,
|
||
[DatetimePicker.name]: DatetimePicker,
|
||
[Toast.name]: Toast,
|
||
|
||
FieldDatePicter
|
||
},
|
||
computed: {
|
||
isMoreConditionShow() {
|
||
return this.OrgLv2Name !== '全国'
|
||
},
|
||
province() {
|
||
const name = []
|
||
this.OrgLv2s.forEach((item) => {
|
||
name.push(item.name)
|
||
})
|
||
return name
|
||
},
|
||
city() {
|
||
const city = ['全部']
|
||
this.OrgLv3s.forEach((item) => {
|
||
if (item.upBranchCode === this.OrgLv2Code) {
|
||
city.push(item.name)
|
||
}
|
||
})
|
||
return city
|
||
},
|
||
area() {
|
||
const area = ['全部']
|
||
this.OrgLv4s.forEach((item) => {
|
||
if (item.upBranchCode === this.OrgLv3Code) {
|
||
area.push(item.name)
|
||
}
|
||
})
|
||
return area
|
||
}
|
||
},
|
||
data() {
|
||
return {
|
||
timeMinDate: new Date(new Date().getFullYear() - 3, new Date().getMonth() + 1, new Date().getDate()),
|
||
timeMaxDate: new Date(),
|
||
TimeFlag: '',
|
||
currentDate: '',
|
||
timeShow: false,
|
||
dialogForm: {
|
||
outOrderType: '',
|
||
dateFlag: 'm',
|
||
startDate: '',
|
||
endDate: ''
|
||
},
|
||
show: false,
|
||
outOrderType: 'accept', // advance
|
||
dateFlag: 'm',
|
||
style02: 'style02', //style02 时，显示红字红三角的样式，不写的话展示默认样式
|
||
currentIndex: 0, //0 当月 1当天
|
||
theads: ['序号', '承保时间', '预收时间', '产品名称', '保费（元）', '业务员', '机构','查看'],
|
||
tableData: [],
|
||
total: 0,
|
||
minDate: '',
|
||
maxDate: new Date(),
|
||
filterDate: '',
|
||
postDate: '', //实际给后台传的时间
|
||
loading: false,
|
||
finished: false,
|
||
pageNum: 1,
|
||
pageSize: 50,
|
||
manageLv: 1, //当前人机构等级
|
||
// 二级机构筛选是否显示
|
||
isOrgLv2ConditionShow: false,
|
||
// 三级机构筛选是否显示
|
||
isOrgLv3ConditionShow: false,
|
||
// 四级机构筛选是否显示
|
||
isOrgLv4ConditionShow: false,
|
||
OrgLvName: '',
|
||
OrgLv2Name: '',
|
||
OrgLv3Name: '',
|
||
OrgLv4Name: '',
|
||
OrgLv2Code: '',
|
||
OrgLv2s: [],
|
||
OrgLv3Code: '',
|
||
OrgLv3s: [],
|
||
OrgLv4Code: '',
|
||
OrgLv4s: [],
|
||
params: {
|
||
// 86: 全国
|
||
manageCode: '86',
|
||
// 01: 全国, 02: 中心支公司, 03: 营销服务部, 04: 下辖营业区
|
||
manageLv: '01',
|
||
// 日期类型: 年/月/日/实时
|
||
queryType: 'd',
|
||
date: currentDate,
|
||
// all: 汇总, prem: 保费排行, active：人力排行, product: 产品
|
||
type: 'all',
|
||
// 1: 中心支公司, 2: 营销服务部, 3: 下辖营业区
|
||
queryCom: ''
|
||
},
|
||
isJzg: false, //是否是内勤账号 branchType=JZG 、N 开头的是 (fasle)内勤账号 ；branchType= 数字的是外勤(true)
|
||
titleText: '全部',
|
||
firstTime: true,
|
||
monthValue: '',
|
||
maxDate: new Date(),
|
||
monthDate: new Date(),
|
||
overlayShow: false,
|
||
hebaoShow: false,
|
||
xiangqingShow: false,
|
||
orderNo: '',
|
||
listShow: false,
|
||
}
|
||
},
|
||
created() {
|
||
this.getyaerMonth();
|
||
this.getmonthList();
|
||
this.getdayList();
|
||
this.outOrderTypeChange();
|
||
},
|
||
mounted() {
|
||
// this.getInfo()
|
||
let date = new Date()
|
||
let month = date.getMonth() + 1
|
||
if (month <= 9) {
|
||
month = '0' + month
|
||
}
|
||
//默认展示当天数据
|
||
this.postDate = date.getFullYear() + '-' + month + '-' + date.getDate()
|
||
this.initData()
|
||
},
|
||
methods: {
|
||
|
||
async getInfo() {
|
||
// let userInfo = JSON.parse(localStorage.getItem('userInfo'))
|
||
// // 获取代理人信息
|
||
// if (userInfo) {
|
||
// this.isJzg = isNumber(Number(userInfo.branchType))
|
||
// }
|
||
},
|
||
openTime(flag) {
|
||
//禁止软键盘弹出
|
||
document.activeElement.blur();
|
||
this.TimeFlag = flag
|
||
// this.dialogForm.dateFlag = ''
|
||
this.timeShow = true
|
||
},
|
||
timeConfirm(t) {
|
||
this.$nextTick(() => {
|
||
// console.log(this.currentDate)
|
||
let time = new Date(t)
|
||
let y = time.getFullYear()
|
||
let m = time.getMonth() + 1 < 10 ? '0' + (time.getMonth() + 1) : time.getMonth() + 1
|
||
let d = time.getDate() < 10 ? '0' + time.getDate() : time.getDate()
|
||
// console.log(y, m, d)
|
||
this.dialogForm[this.TimeFlag] = y + '-' + m + '-' + d
|
||
this.timeShow = false
|
||
})
|
||
},
|
||
timeCancel() {
|
||
this.timeShow = false
|
||
},
|
||
//切换当月、当天
|
||
switchDayOrMonth(index) {
|
||
this.filterDate = ''
|
||
// currentIndex 0 当月 1当天
|
||
let nowDate = new Date()
|
||
let month = nowDate.getMonth() + 1
|
||
if (month <= 9) {
|
||
month = '0' + month
|
||
}
|
||
let date = {
|
||
year: nowDate.getFullYear(),
|
||
month: month,
|
||
date: nowDate.getDate()
|
||
}
|
||
if (index == 0) {
|
||
this.postDate = date.year + '-' + date.month
|
||
} else {
|
||
this.postDate = date.year + '-' + date.month + '-' + date.date
|
||
}
|
||
this.dateFlag = index == 0 ? 'm' : 'd'
|
||
this.currentIndex = index == 0 ? 1 : 0
|
||
this.pageNum = 1
|
||
this.tableData = []
|
||
this.queryOutOrderListFunc()
|
||
},
|
||
popupOnConfirm() {
|
||
if(this.dialogForm.dateFlag == 'y') {
|
||
if(this.isStartDateInvalid()) {
|
||
Toast({message: '开始日期不能小于结束日期!',size: 'large'});
|
||
return
|
||
} else {
|
||
this.titleText = this.dialogForm.startDate.toString() + '~' + this.dialogForm.endDate.toString()
|
||
}
|
||
}
|
||
if (!this.dialogForm.dateFlag) {
|
||
this.startDate = this.dialogForm.startDate
|
||
this.endDate = this.dialogForm.endDate
|
||
} else {
|
||
this.startDate = ''
|
||
this.endDate = ''
|
||
}
|
||
|
||
this.outOrderType = this.dialogForm.outOrderType
|
||
this.dateFlag = this.dialogForm.dateFlag
|
||
this.show = false
|
||
if(this.dateFlag == 'all') {
|
||
this.titleText = '全部'
|
||
}
|
||
if(this.dateFlag == 'm') {
|
||
this.titleText = this.monthValue
|
||
}
|
||
|
||
|
||
this.outOrderTypeChange()
|
||
this.queryOutOrderListFunc()
|
||
},
|
||
openPopup() {
|
||
|
||
this.dialogForm.outOrderType = this.outOrderType;
|
||
this.dialogForm.dateFlag = this.dateFlag;
|
||
// if (this.dateFlag) {
|
||
// this.dialogForm.startDate = ''
|
||
// this.dialogForm.endDate = ''
|
||
// }
|
||
if(this.firstTime == true) {
|
||
this.dialogForm.dateFlag = 'm'
|
||
this.firstTime = false
|
||
}
|
||
// console.log(this.dialogForm.dateFlag);
|
||
this.show = true
|
||
},
|
||
//时间筛选
|
||
onDateConfirm(data) {
|
||
this.dateFlag = 'm'
|
||
this.postDate = data
|
||
this.pageNum = 1
|
||
this.tableData = []
|
||
this.queryOutOrderListFunc()
|
||
},
|
||
async initData() {
|
||
// 初始化年份筛选数据
|
||
// const currentYear = new Date().getFullYear()
|
||
// const startYear = currentYear - 10
|
||
// for (let year = startYear; year <= currentYear; year++) {
|
||
// this.years.unshift(year)
|
||
// }
|
||
/**
|
||
* 查询机构下拉列表
|
||
* manageCode, manageLv传空查全国所有二级机构
|
||
**/
|
||
this.$toast.loading({
|
||
duration: 0, // 持续展示 toast
|
||
forbidClick: true, // 禁用背景点击
|
||
loadingType: 'spinner',
|
||
message: '加载中……'
|
||
})
|
||
const res = await getAgentInfo({})
|
||
if (res.result == 0) {
|
||
this.isJzg = isNumber(Number(res.branchType))
|
||
if (this.isJzg) {
|
||
this.OrgLv2Name = '营业区'
|
||
this.OrgLv3Name = '营业部'
|
||
this.OrgLv4Name = '营业组'
|
||
} else {
|
||
this.OrgLvName = '全部'
|
||
this.OrgLv2Name = '全部'
|
||
this.OrgLv3Name = '全部'
|
||
this.OrgLv4Name = '全部'
|
||
}
|
||
const resf = await getMisBranchComList2({
|
||
// isJzg: this.isJzg,
|
||
// bussinessType: 'normal',
|
||
manageCode: this.isJzg ? '' : '86'
|
||
// manageLv: '06'
|
||
})
|
||
if (res.result == 0) {
|
||
this.OrgLv2s.push(...resf.content)
|
||
}
|
||
}
|
||
|
||
// let resData = await getBranchByUser({})
|
||
// this.$toast.clear()
|
||
// if (resData.result != '0') return this.$toast(resData.resultMessage)
|
||
// this.manageLv = resData.content.level
|
||
// console.log(this.manageLv, 'this.manageLv')
|
||
// // 1、如果内勤（四级和五级）查看出单详情，选择机构名称时，可以选择内勤所辖区，可能存在一个或者多个；
|
||
// // 2、如果外勤（组长及以上）查看出单详情，选择机构名称时，区只有一个。
|
||
// //（内勤）level 04,05时 服务机构 （外勤）level 06,07,08时 区
|
||
// if (this.manageLv == '04' || this.manageLv == '05') {
|
||
// const res = await getMisBranchComList2({
|
||
// bussinessType: 'normal',
|
||
// // manageCode: resData.content.code,
|
||
// manageCode: '86',
|
||
// // "upComCode": "86" ,//---上级公司编码
|
||
// isJzg: this.isJzg,
|
||
// manageLv: resData.content.level
|
||
// })
|
||
// if (res.result === '0') {
|
||
// this.OrgLv2s.push(...res.content)
|
||
// this.OrgLv2Name = this.OrgLv2s[0].name
|
||
// this.OrgLv2Code = this.OrgLv2s[0].code
|
||
// // this.orgCode = this.OrgLv2s[0].code
|
||
// this.onOrgLv2ConditionConfirm(this.OrgLv2Name, 'false')
|
||
// } else {
|
||
// this.$toast(res.resultMessage)
|
||
// }
|
||
// } else if (this.manageLv == '06') {
|
||
// // 区
|
||
// this.OrgLv2Name = resData.content.name
|
||
// this.OrgLv2Code = resData.content.code
|
||
// this.onOrgLv2ConditionConfirm(this.OrgLv2Name, 'false')
|
||
// } else if (this.manageLv == '07') {
|
||
// //部
|
||
// this.OrgLv2Name = resData.content.distName
|
||
// this.OrgLv2Code = resData.content.distCode
|
||
// this.OrgLv3Name = resData.content.name
|
||
// this.OrgLv3Code = resData.content.code
|
||
// this.onOrgLv3ConditionConfirm(this.OrgLv3Name, 'false')
|
||
// } else if (this.manageLv == '08') {
|
||
// //组
|
||
// this.OrgLv2Name = resData.content.distName
|
||
// this.OrgLv2Code = resData.content.distCode
|
||
// this.OrgLv3Name = resData.content.depName
|
||
// this.OrgLv3Code = resData.content.depCode
|
||
// this.OrgLv4Name = resData.content.name
|
||
// this.OrgLv4Code = resData.content.code
|
||
// }
|
||
this.queryOutOrderListFunc()
|
||
// 查询默认数据
|
||
// const result = await this.getRankData()
|
||
// this.setSummarizingData(result)
|
||
},
|
||
// 查询列表数据
|
||
queryOutOrderListFunc() {
|
||
this.$toast.loading({
|
||
duration: 0, // 持续展示 toast
|
||
forbidClick: true, // 禁用背景点击
|
||
loadingType: 'spinner',
|
||
message: '加载中……'
|
||
})
|
||
let data = {}
|
||
if(this.dateFlag == 'all') {
|
||
data = {
|
||
outOrderType: this.outOrderType, // "accept",//--出单类型 承保 accept 预收 advance
|
||
// dateFlag: this.dateFlag, // -最近一月-m,最近一年y ,全部-all
|
||
dateFlag: '', // 暂不使用改参数，默认给空
|
||
// appntDate: this.postDate,
|
||
distCode: this.OrgLv2Code,
|
||
depCode: this.OrgLv3Code,
|
||
orgCode: this.OrgLv4Code,
|
||
pageNum: this.pageNum,
|
||
pageSize: this.pageSize
|
||
}
|
||
} else {
|
||
data = {
|
||
outOrderType: this.outOrderType, // "accept",//--出单类型 承保 accept 预收 advance
|
||
startDate: this.dialogForm.startDate, // "2024-09-01",
|
||
endDate: this.dialogForm.endDate, //"2024-09-30",
|
||
// dateFlag: this.dateFlag, // -最近一月-m,最近一年y ,全部-all
|
||
dateFlag: '', // 暂不使用改参数，默认给空
|
||
// appntDate: this.postDate,
|
||
distCode: this.OrgLv2Code,
|
||
depCode: this.OrgLv3Code,
|
||
orgCode: this.OrgLv4Code,
|
||
pageNum: this.pageNum,
|
||
pageSize: this.pageSize
|
||
}
|
||
}
|
||
queryOutOrderList(data).then((res) => {
|
||
this.$toast.clear()
|
||
if (res.result == 0) {
|
||
if (res.content) {
|
||
// this.pageNum++
|
||
//点击其他筛选条件，finished会变为true，需要重置finished数据全部加载完成--false
|
||
this.finished = false
|
||
//当下一页为0时 表示全部数据加载完毕
|
||
if (res.content.nextPage == 0) {
|
||
this.finished = true
|
||
}
|
||
this.tableData = this.tableData = res.content.list
|
||
this.total = res.content.total
|
||
this.loading = false
|
||
this.listShow = true
|
||
} else{
|
||
this.tableData = []
|
||
this.listShow = false
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 双击事件
|
||
double_click(data) {
|
||
// console.log(JSON.parse(JSON.stringify(data)), '发生了点击')
|
||
this.hebaoShow = true
|
||
// this.$router.push({
|
||
// path: '/generateImg'
|
||
// })
|
||
localStorage.setItem('orderList', JSON.stringify(data))
|
||
},
|
||
|
||
currentChange(page) {
|
||
this.pageNum = page
|
||
this.tableData = []
|
||
this.queryOutOrderListFunc()
|
||
},
|
||
// 筛选二级机构-区
|
||
async onOrgLv2ConditionConfirm(data, status) {
|
||
this.isOrgLv2ConditionShow = false
|
||
let OrgLv2 = this.OrgLv2s.find((item) => item.name === data)
|
||
if (OrgLv2) {
|
||
this.OrgLv2Code = OrgLv2.code
|
||
this.params.manageCode = this.OrgLv2Code
|
||
this.params.manageLv = '02'
|
||
}
|
||
// if (data === '全国') {
|
||
// this.params.manageCode = '86'
|
||
// this.params.manageLv = '01'
|
||
// }
|
||
this.OrgLv2Name = data
|
||
this.OrgLv3Name = this.isJzg ? '营业部' : '全部'
|
||
this.OrgLv4Name = this.isJzg ? '营业组' : '全部'
|
||
this.OrgLv3Code = ''
|
||
this.OrgLv4Code = ''
|
||
// 点击其他筛选条件-重置当前页为第一页
|
||
if (status != 'false') {
|
||
this.pageNum = 1
|
||
this.tableData = []
|
||
this.queryOutOrderListFunc()
|
||
}
|
||
// 查询三级机构
|
||
const res = await getMisBranchComList2({
|
||
// isJzg: this.isJzg,
|
||
// bussinessType: 'normal',
|
||
manageCode: this.OrgLv2Code
|
||
// manageLv: '06'
|
||
})
|
||
this.OrgLv3s.splice(0)
|
||
this.OrgLv3s.push(...res.content)
|
||
},
|
||
// 筛选三级机构-部
|
||
async onOrgLv3ConditionConfirm(data, status) {
|
||
this.isOrgLv3ConditionShow = false
|
||
this.OrgLv3Name = data
|
||
let OrgLv3 = this.OrgLv3s.find((item) => item.name === data)
|
||
if (OrgLv3) {
|
||
this.OrgLv3Code = OrgLv3.code
|
||
this.params.manageCode = this.OrgLv3Code
|
||
this.params.manageLv = '03'
|
||
}
|
||
if (data === '全部') {
|
||
this.params.manageCode = this.OrgLv2Code
|
||
this.params.manageLv = '02'
|
||
this.OrgLv3Code = ''
|
||
}
|
||
this.OrgLv4Code = ''
|
||
this.OrgLv4Name = this.isJzg ? '营业组' : '全部'
|
||
// this.OrgLv2Code = ''
|
||
// this.OrgLv4Code = ''
|
||
// 点击其他筛选条件-重置当前页为第一页
|
||
if (status != 'false') {
|
||
this.pageNum = 1
|
||
this.tableData = []
|
||
this.queryOutOrderListFunc()
|
||
}
|
||
// 查询四级机构
|
||
const res = await getMisBranchComList2({
|
||
// isJzg: this.isJzg,
|
||
// bussinessType: 'normal',
|
||
manageCode: this.OrgLv3Code
|
||
// manageLv: '07'
|
||
})
|
||
this.OrgLv4s.splice(0)
|
||
this.OrgLv4s.push(...res.content)
|
||
},
|
||
// 筛选四级机构-组
|
||
async onOrgLv4ConditionConfirm(data) {
|
||
this.isOrgLv4ConditionShow = false
|
||
this.OrgLv4Name = data
|
||
let area = this.OrgLv4s.find((item) => item.name === data)
|
||
if (area) {
|
||
this.OrgLv4Code = area.code
|
||
this.params.manageCode = this.OrgLv4Code
|
||
this.params.manageLv = '04'
|
||
}
|
||
if (data === '全部') {
|
||
this.params.manageCode = this.OrgLv3Code
|
||
this.params.manageLv = '03'
|
||
this.OrgLv4Code = ''
|
||
}
|
||
// 点击其他筛选条件-重置当前页为第一页
|
||
this.pageNum = 1
|
||
this.tableData = []
|
||
this.queryOutOrderListFunc()
|
||
},
|
||
getyaerMonth() {
|
||
var currentDate = new Date();
|
||
var currentYear = currentDate.getFullYear();
|
||
var currentMonth = currentDate.getMonth() + 1; // 月份从0开始，所以要加1
|
||
this.monthValue = currentYear + '-' + currentMonth
|
||
this.dialogForm.startDate = currentYear + '-' + currentMonth + '-' + '01' // "2024-09-01",
|
||
this.dialogForm.endDate = currentYear + '-' + currentMonth + '-' + '30'//"2024-09-30",
|
||
this.titleText = this.monthValue
|
||
},
|
||
typeCheck(e) {
|
||
this.dialogForm.dateFlag = e
|
||
if(e == 'all') {
|
||
// this.titleText = '全部'
|
||
console.log(this.titleText);
|
||
}
|
||
if(e == 'm') {
|
||
this.overlayShow = true
|
||
// this.titleText = this.monthValue
|
||
this.getyaerMonth();
|
||
}
|
||
if(e == 'y') {
|
||
this.dialogForm.startDate = ''
|
||
this.dialogForm.endDate = ''
|
||
}
|
||
|
||
},
|
||
isStartDateInvalid() {
|
||
return this.dialogForm.endDate && new Date(this.dialogForm.startDate) > new Date(this.dialogForm.endDate);
|
||
},
|
||
// 选择月份事件
|
||
formatter(type, value) {
|
||
if (type === 'year') {
|
||
return `${value}年`;
|
||
} else if (type === 'month') {
|
||
return `${value}月`
|
||
}
|
||
return value
|
||
},
|
||
// 月份选择取消按钮
|
||
cancelChange() {
|
||
this.overlayShow = false
|
||
},
|
||
// 月份选择确认按钮
|
||
confirmChange(t) {
|
||
this.$nextTick(() => {
|
||
let time = new Date(t)
|
||
let y = time.getFullYear()
|
||
let m = time.getMonth() + 1 < 10 ? '0' + (time.getMonth() + 1) : time.getMonth() + 1
|
||
console.log(y, m)
|
||
this.monthValue = y + '-' + m
|
||
this.dialogForm.startDate = y + '-' + m + '-' + '01' // "2024-08-01",
|
||
this.dialogForm.endDate = y + '-' + m + '-' + '31'//"2024-08-31",
|
||
})
|
||
this.overlayShow = false
|
||
},
|
||
outOrderTypeChange() {
|
||
this.theads = ['序号', '承保时间', '预收时间', '产品名称', '保费（元）', '业务员', '机构','查看']
|
||
if (this.outOrderType === 'accept') {
|
||
this.theads.splice(2,1)
|
||
} else {
|
||
this.theads.splice(1,1)
|
||
|
||
}
|
||
|
||
},
|
||
xiangqing(num) {
|
||
this.orderNo = num
|
||
this.xiangqingShow = true;
|
||
},
|
||
closeDetails() {
|
||
this.xiangqingShow = !this.xiangqingShow
|
||
},
|
||
closeHebao() {
|
||
this.hebaoShow = !this.hebaoShow
|
||
},
|
||
getmonthList() {
|
||
function getOneYearAgoDate() {
|
||
const now = new Date();
|
||
now.setFullYear(now.getFullYear() - 1);
|
||
return now;
|
||
}
|
||
const oneYearAgoDate = getOneYearAgoDate();
|
||
this.minDate = oneYearAgoDate
|
||
},
|
||
getdayList() {
|
||
function getOneYearAgoDate() {
|
||
const now = new Date();
|
||
now.setFullYear(now.getFullYear() - 2);
|
||
return now;
|
||
}
|
||
const oneYearAgoDate = getOneYearAgoDate();
|
||
this.timeMinDate = oneYearAgoDate
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.classification {
|
||
font-size: 12px;
|
||
padding: 10px;
|
||
//background: #ee3030;
|
||
//color: #fff;
|
||
}
|
||
.van-icon {
|
||
font-weight: bolder;
|
||
}
|
||
.titlebtn {
|
||
background-color: #fff;
|
||
border: none;
|
||
font-size: 12px;
|
||
color: #333;
|
||
padding: 8px 17px;
|
||
border-radius: 2px;
|
||
}
|
||
::v-deep .classification .van-icon {
|
||
vertical-align: middle;
|
||
margin-right: 5px;
|
||
margin-bottom: 3px;
|
||
}
|
||
.filterDate {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 7px 0;
|
||
.number {
|
||
flex-shrink: 0;
|
||
margin: 0 7px;
|
||
font-size: 14px;
|
||
}
|
||
.filterTime {
|
||
margin-right: 5px;
|
||
}
|
||
}
|
||
/deep/.van-field__label {
|
||
width: 0px;
|
||
}
|
||
.table {
|
||
//overflow-x: auto;导致 List 无法正确地判断滚动容器。解决方法是去除该样式
|
||
// overflow-x: auto;
|
||
margin: 5px;
|
||
box-sizing: border-box;
|
||
background: #fff;
|
||
}
|
||
.table th {
|
||
width: 100px;
|
||
}
|
||
table {
|
||
width: 180vw;
|
||
}
|
||
.table {
|
||
margin-top: 10px;
|
||
table {
|
||
border-collapse: collapse;
|
||
}
|
||
|
||
table,
|
||
th,
|
||
td {
|
||
border: 1px solid #999;
|
||
text-align: center;
|
||
font-size: 14px;
|
||
line-height: 30px;
|
||
background: #fff;
|
||
}
|
||
thead {
|
||
th {
|
||
height: 40px;
|
||
line-height: 40px;
|
||
background: #e9332e;
|
||
color: #fff;
|
||
}
|
||
}
|
||
}
|
||
.th-fixed {
|
||
position: sticky;
|
||
left: 0;
|
||
width: 200px;
|
||
padding: 0 5px;
|
||
}
|
||
.td-fixed {
|
||
position: sticky;
|
||
width: 200px;
|
||
padding: 0 5px;
|
||
left: 0;
|
||
text-decoration: underline;
|
||
}
|
||
/deep/.van-radio__icon {
|
||
height: unset !important;
|
||
}
|
||
.groups {
|
||
display: flex;
|
||
margin: 0px 10px;
|
||
.van-button {
|
||
padding: 2px 20px;
|
||
}
|
||
}
|
||
.search_col {
|
||
display: flex;
|
||
padding: 10px;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
background: #ee3030;
|
||
}
|
||
.topBox {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: start;
|
||
}
|
||
.shouButton {
|
||
margin-right: 10px;
|
||
}
|
||
.checked {
|
||
color: #ee3030;
|
||
}
|
||
.icon {
|
||
font-size: 19px;
|
||
color: #fff;
|
||
}
|
||
.content {
|
||
margin: 10px;
|
||
//margin-bottom: -20px;
|
||
}
|
||
.button_times {
|
||
margin-top: 5px;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
padding: 0 30px;
|
||
.van-button {
|
||
padding: 2px 10px;
|
||
}
|
||
}
|
||
.timeField {
|
||
border: 1px solid #ebedf0;
|
||
width: 120px;
|
||
padding: 2px 2px;
|
||
}
|
||
.button_bottom {
|
||
position: absolute;
|
||
bottom: 0;
|
||
width: 100%;
|
||
display: flex;
|
||
.van-button {
|
||
width: 50%;
|
||
border-color: #ee3030;
|
||
}
|
||
}
|
||
.hebao,
|
||
.xiangqing {
|
||
width: 100%;
|
||
height: 100vh;
|
||
background-color: #fff;
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
}
|
||
.noList {
|
||
font-size: 18px;
|
||
text-align: center;
|
||
margin-top: 100px;
|
||
}
|
||
/deep/.van-toast--text {
|
||
width: 230px !important;
|
||
}
|
||
</style>
|