hz/ebiz-h5
1
0
Fork 0
mirror of http://112.124.100.131/GFRS/ebiz-h5.git synced 2025-12-07 00:46:44 +08:00
Code Issues Packages Projects Releases Wiki Activity

出单 页面修改

Browse Source 
todo
缺少双击之后图片生成
This commit is contained in:
陈昱达
2024-09-24 16:54:23 +08:00
parent e5fc51effa
commit 516de0de16
3 changed files with 482 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/api/ebiz/branchOffice/branchOffice.js
View File

@@ -39,10 +39,30 @@ export function getOrgList(data) {
// 获取MIS全部机构 (分级)接口--因内勤多加一级，所以用这个接口
export function getMisBranchComList(data) {
// data.isJzg false 为内勤
// data.isJzg true 为外勤
return request({
url: getUrl('/data/performance/getMisBranchComList', 1),
url: getUrl( '/data/performance/getMisBranchComList', 1),
method: 'post',
data
})
}
export function getMisBranchComList2(data) {
// data.isJzg false 为内勤
// data.isJzg true 为外勤
return request({
url: getUrl( '/agent/agent/getJZGManageComList' , 1),
method: 'post',
data
})
}
// 内勤机构
// export function getMisBranchComList(data) {
// return request({
// url: getUrl('/data/performance/getMisBranchComList', 1),
// method: 'post',
// data
// })
// }

168
src/components/ebiz/billingDetail/tableDetail2.vue Normal file
View File

@@ -0,0 +1,168 @@
<template>
<div class="statisticsTable">
<div class="statisticsTable_table">
<div class="table">
<table cellspacing="0" summary cellpadding="1">
<thead>
<tr>
<th :class="{'th-fixed':index<1}" v-for="(item,index) in theads" :key="index">{{item}}</th>
</tr>
</thead>
<tbody>
<tr v-for="(item, index) in tableData" :key="index" :ref="'th'+ index" @click="(e)=>double_click(index)" >
<td class="th-fixed" @click="goLink(item)">{{Number(index)+1}}</td>
<td>{{item.sign_date}}</td>
<td>{{item.appnt_date}}</td>
<td>{{item.productName}}</td>
<td>{{item.prem}}</td>
<td>{{item.name}}</td>
<td>{{item.appntDate}}</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="pagination" v-if="total>5">
<div type="text" @click="pageUp" :style="pageNum>1?'color:red':''">< 上一页</div>
<div style="color:red">{{pageNum}}/{{Math.ceil(total / pageSize)}}</div>
<div @click="pageDown" :style="pageNum<Math.ceil(total / pageSize)?'color:red':''">下一页 ></div>
</div>
</div>
</template>
<script>
export default {
name: 'tableDetail',
props:{
theads:{
type:Array,
default:[]
},
isLink:{
type:Boolean,
default:false,
},
total:{
type:Number,
default:false,
},
pageSize:{
type: Number,
default:false,
},
pageNum:{
type:Number,
default:false,
},
tableData:{
type:Array,
default:[]
}
},
data() {
return {
}
},
created(){
},
methods: {
double_click(index, fn) {
// console.log(this.$refs['th'+index]);
let timestamp = 0;
this.$refs['th'+index][0].addEventListener('click', () => {
const now = +new Date();
if (now - timestamp <= 300) {
this.$emit('double_click', this.$refs['th'+index][0])
// fn();
timestamp = 0;
} else {
timestamp = now;
}
});
},
pageUp(){
if(this.pageNum<=1){
return false
}
let page = this.pageNum -1
this.$emit('currentChange',page)
},
pageDown(){
let end_num = Math.ceil(this.total/this.pageNum)
if(this.pageNum>=end_num){
return false
}
let page = this.pageNum + 1
this.$emit('currentChange',page)
},
goLink(item){
if(this.isLink){
this.$emit('goLink',item)
}
},
},
}
</script>
<style lang="scss" scoped>
.pagination{
display: flex;
margin-top: 10px;
margin-bottom: 10px;
justify-content: space-between;
align-items: center;
}
.statisticsTable_table{
height: 82.5vh;
overflow: auto;
//width: 1000px;
}
.statisticsTable_table .table{
width: 1000px;
}
.statisticsTable th {
width: 800px;
}
table {
// width: 200vw;
}
.statisticsTable {
width: 100%;
overflow-x:hidden ;
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:150px;
padding: 0 5px;
}
.td-fixed {
// position: sticky;
width:150px;
padding: 0 5px;
left: 0;
text-decoration: underline;
}
</style>

346
src/views/ebiz/billingDetail/billingDetail.vue
View File

@@ -3,7 +3,35 @@
<img class="w40 h40 mt60 mb20" src="@/assets/images/ebiz/waiting.png" alt="" />
<p class="f10 gray">该功能暂未开放，敬请期待！</p>
</div>
<div v-else-if="isNoOrganization == 1">
<div v-else-if="isNoOrganization == 1" style="background: #fff">
<div class="search_col">
<div class="shouButton">
<van-button size="small">{{ outOrderType === 'accept'?'承保':'预收' }}</van-button>
</div>
<div class="group">
<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>
</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'">
@@ -34,40 +62,40 @@
</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="filterDate">-->
<!-- <div class="filterTime">-->
<!-- &lt;!&ndash; <van-field-->
<!-- :value="filterDate"-->
<!-- readonly-->
<!-- label=""-->
<!-- name=""-->
<!-- right-icon="arrow"-->
<!-- placeholder="时间筛选"-->
<!-- v-validate="'required'"-->
<!-- @click="toSelect('8')"-->
<!-- /> &ndash;&gt;-->
<!-- <FieldDatePicter-->
<!-- label=""-->
<!-- name=""-->
<!-- :isDefault="true"-->
<!-- :value.sync="filterDate"-->
<!-- type="year-month"-->
<!-- :flag="true"-->
<!-- :defaultStyle="style02"-->
<!-- placeholder="时间筛选"-->
<!-- @confirm="onDateConfirm($event, '2')"-->
<!-- :maxDate="maxDate"-->
<!-- ></FieldDatePicter>-->
<!-- </div>-->
<!--&lt;!&ndash; <div class="number">&ndash;&gt;-->
<!--&lt;!&ndash; <van-button type="danger" @click="switchDayOrMonth(0)" :plain="currentIndex == 0 ? true : false" size="small">当月</van-button>&ndash;&gt;-->
<!--&lt;!&ndash; <van-button type="danger" @click="switchDayOrMonth(1)" :plain="currentIndex == 1 ? true : false" size="small">当天</van-button>&ndash;&gt;-->
<!--&lt;!&ndash; </div>&ndash;&gt;-->
<!-- </div>-->
<div class="table">
<van-list v-model="loading" :finished="finished" @load="queryOutOrderListFunc" :immediate-check="false" finished-text="没有更多数据了">
<tableDetail :theads="theads" :tableData="tableData"></tableDetail>
</van-list>
<!-- <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" @double_click="double_click"></tableDetail2>
<!-- </van-list>-->
</div>
<!-- 二级机构筛选栏 -->
@@ -82,21 +110,89 @@
<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="dialogForm.dateFlag = 'all'">全部</van-button>
<van-button size="small" :class="dialogForm.dateFlag ==='m' ? 'checked' :''" @click="dialogForm.dateFlag = 'm'">最近一月</van-button>
<van-button size="small" :class="dialogForm.dateFlag ==='y' ? 'checked' :''" @click="dialogForm.dateFlag = 'y'">最近一年</van-button>
</div>
<div 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>
</div>
</template>
<script>
import { Icon } from 'vant'
import tableDetail from '@/components/ebiz/billingDetail/tableDetail'
import { getMisBranchComList } from '@/api/ebiz/branchOffice/branchOffice'
import { Icon ,RadioGroup,Radio,DatetimePicker } from 'vant'
import tableDetail2 from '@/components/ebiz/billingDetail/tableDetail2'
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: { tableDetail, [Icon.name]: Icon, FieldDatePicter },
components: {
tableDetail2,
[Icon.name]: Icon,
[RadioGroup.name]: RadioGroup,
[Radio.name]: Radio,
[DatetimePicker.name]: DatetimePicker,
FieldDatePicter
},
computed: {
isMoreConditionShow() {
return this.OrgLv2Name !== '全国'
@@ -129,19 +225,33 @@ export default {
},
data() {
return {
dateFlag: 'd',
timeMinDate: new Date(new Date().getFullYear() - 3 , new Date().getMonth()+ 1, new Date().getDate()),
timeMaxDate: new Date(new Date().getFullYear(), new Date().getMonth()+ 1 , new Date().getDate()),
TimeFlag:'',
currentDate:'',
timeShow:false,
dialogForm:{
outOrderType:'',
dateFlag:'',
startDate:'',
endDate:''
},
show:false,
outOrderType:'accept', // advance
dateFlag: '',
style02: 'style02', //style02 时，显示红字红三角的样式，不写的话展示默认样式
isNoOrganization: null,
currentIndex: 0, //0 当月 1当天
theads: ['姓名', '产品名称', '保费（元）', '预收时间', '承保时间'],
theads: ['序号', '承保时间', '预售时间', '产品（显示产品简称）', '保费（万元）','业务员姓名','机构'],
tableData: [],
total:0,
maxDate: new Date(),
filterDate: '',
postDate: '', //实际给后台传的时间
loading: false,
finished: false,
pageNum: 1,
pageSize: 5,
pageSize: 50,
manageLv: 1, //当前人机构等级
// 二级机构筛选是否显示
isOrgLv2ConditionShow: false,
@@ -170,13 +280,15 @@ export default {
type: 'all',
// 1: 中心支公司, 2: 营销服务部, 3: 下辖营业区
queryCom: ''
}
},
isJzg:false,//是否是内勤账号 branchType=JZG 、N 开头的是 内勤账号 ；branchType= 数字的是外勤
}
},
created() {
},
mounted() {
this.getInfo()
let date = new Date()
let month = date.getMonth() + 1
if (month <= 9) {
@@ -187,6 +299,36 @@ export default {
this.initData()
},
methods: {
getInfo() {
let userInfo = JSON.parse(localStorage.getItem('userInfo'))
// 获取代理人信息
if (userInfo) {
this.isJzg =isNumber(Number(userInfo.branchType))
}
},
openTime(flag){
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 = ''
@@ -212,6 +354,33 @@ export default {
this.tableData = []
this.queryOutOrderListFunc()
},
popupOnConfirm(){
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
this.queryOutOrderListFunc()
},
openPopup(){
this.dialogForm = {
outOrderType:this.outOrderType,
dateFlag:this.dateFlag,
startDate: this.startDate,
endDate: this.endDate
}
if(this.dateFlag){
this.dialogForm.startDate = ''
this.dialogForm.endDate = ''
}
this.show = true
},
//时间筛选
onDateConfirm(data) {
this.dateFlag = 'm'
@@ -253,9 +422,11 @@ export default {
// 2、如果外勤（组长及以上）查看出单详情，选择机构名称时，区只有一个。
//（内勤）level 04,05时 服务机构 （外勤）level 06,07,08时 区
if (this.manageLv == '04' || this.manageLv == '05') {
const res = await getMisBranchComList({
const res = await getMisBranchComList2({
bussinessType: 'normal',
manageCode: resData.content.code,
// "upComCode": "86" ,//---上级公司编码
isJzg:this.isJzg,
manageLv: resData.content.level
})
if (res.result === '0') {
@@ -301,8 +472,13 @@ export default {
loadingType: 'spinner',
message: '加载中……'
})
queryOutOrderList({
dateFlag: this.dateFlag,
"outOrderType": this.outOrderType, // "accept",//--出单类型 承保 accept 预收 advance
"startDate": this.startDate,// "2024-09-01",
"endDate": this.endDate,//"2024-09-30",
dateFlag: this.dateFlag, // -最近一月-m,最近一年y ,全部-all
appntDate: this.postDate,
distCode: this.OrgLv2Code,
depCode: this.OrgLv3Code,
@@ -313,20 +489,30 @@ export default {
this.$toast.clear()
if (res.result == 0) {
if (res.content) {
this.pageNum++
// this.pageNum++
//点击其他筛选条件，finished会变为true，需要重置finished数据全部加载完成--false
this.finished = false
//当下一页为0时 表示全部数据加载完毕
if (res.content.nextPage == 0) {
this.finished = true
}
this.tableData = this.tableData.concat(res.content.list)
this.tableData = this.tableData=res.content.list
this.total = res.content.total
// this.tableData.push(...res.content.list)
this.loading = false
}
}
})
},
double_click(el){
console.log('元素' + el +'发生了点击');
},
currentChange(page){
this.pageNum = page
this.tableData = []
this.queryOutOrderListFunc()
},
// 筛选二级机构-区
async onOrgLv2ConditionConfirm(data, status) {
this.isOrgLv2ConditionShow = false
@@ -352,7 +538,8 @@ export default {
this.queryOutOrderListFunc()
}
// 查询三级机构
const res = await getMisBranchComList({
const res = await getMisBranchComList2({
isJzg:this.isJzg,
bussinessType: 'normal',
manageCode: this.OrgLv2Code,
manageLv: '06'
@@ -386,10 +573,11 @@ export default {
this.queryOutOrderListFunc()
}
// 查询四级机构
const res = await getMisBranchComList({
const res = await getMisBranchComList2({
isJzg:this.isJzg,
bussinessType: 'normal',
manageCode: this.OrgLv3Code,
manageLv: '07'
manageLv: '07',
})
this.OrgLv4s.splice(0)
this.OrgLv4s.push(...res.content)
@@ -421,9 +609,9 @@ export default {
<style lang="scss" scoped>
.classification {
font-size: 14px;
padding: 15px;
background: #ee3030;
color: #fff;
padding: 10px;
//background: #ee3030;
//color: #fff;
}
.van-icon {
font-weight: bolder;
@@ -501,4 +689,56 @@ table {
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;
}
.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;
.van-button{
padding: 2px 20px;
}
}
.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
}
}
</style>