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

1.数据紧凑些2.筛选承保预收时间3.时间筛选改版4.加个保单详情页5.优化下拉列表6.优化贺报样式7.优化下一页8.修复自定义时间选择不准确的问题

Browse Source
This commit is contained in:
xuxingjun
2024-11-14 15:43:08 +08:00
parent e1c1e79fc6
commit 3a5978b8d5
6 changed files with 302 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/api/ebiz/billingDetail/billingDetail.js
View File

@@ -24,4 +24,12 @@ export function queryOutOrderList(data) {
method: 'post',
data
})
}
// 出单详情
export function queryOutOrderDetail(data) {
return request({
url: getUrl(`/sale/order/queryOutOrderDetail`, 1),
method: 'post',
data
})
}

60
src/components/ebiz/billingDetail/tableDetail2.vue
View File

@@ -11,13 +11,18 @@
<tbody>
<tr v-for="(item, index) in tableData" :key="index" :ref="'th' + index" @click="(e) => double_click(index, item)">
<td class="th-fixed" @click="goLink(item)">{{ Number(index) + 1 }}</td>
<td>{{ item.signDate }}</td>
<td>{{ item.appntDate }}</td>
<td v-if="timeShow == false">{{ item.signDate }}</td>
<td v-if="timeShow">{{ item.appntDate }}</td>
<td>{{ item.productName }}</td>
<td>{{ item.prem }}</td>
<td>{{ item.name }}</td>
<td>{{ item.manageComName }}</td>
<td class="">
<van-button size="mini" type="danger" @click="download(item)">下载贺报</van-button>
<van-button size="mini" type="info" @click="look(item.orderNo)">查看</van-button>
</td>
<!-- <td>{{ item.branchTypeName }}</td>-->
</tr>
</tbody>
</table>
@@ -28,6 +33,8 @@
<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 v-if="pageNum == 1" class="shangzheBox"></div>
<div v-if="pageNum >= Math.ceil(total / pageSize)" class="xiazheBox"></div>
</div>
</div>
</template>
@@ -62,9 +69,19 @@ export default {
}
},
data() {
return {}
return {
timeShow: false,
}
},
created() {
for(let i=0;i<this.theads.length;i++) {
if(this.theads[i] == '承保时间') {
this.timeShow = true
} else {
this.timeShow = false
}
}
},
created() {},
methods: {
double_click(index, fn, data) {
let timestamp = 0
@@ -98,6 +115,20 @@ export default {
if (this.isLink) {
this.$emit('goLink', item)
}
},
// 跳转至下载贺报页面
download(data){
this.$emit('from-child', data);
},
// 查看详情 跳转至详情页面
look(num) {
console.log(num);
this.$router.push({
path: '/policyDetails',
query: {
orderNo: num,
}
})
}
}
}
@@ -110,6 +141,21 @@ export default {
margin-bottom: 10px;
justify-content: space-between;
align-items: center;
position: relative;
.shangzheBox {
position: absolute;
left: 0;
top: 0;
width: 70px;
height: 30px;
}
.xiazheBox {
position: absolute;
right: 0;
top: 0;
width: 70px;
height: 30px;
}
}
.statisticsTable_table {
height: 82.5vh;
@@ -120,7 +166,7 @@ export default {
width: 1000px;
}
.statisticsTable th {
width: 800px;
width: 120px;
}
table {
// width: 200vw;
@@ -153,12 +199,12 @@ table {
.th-fixed {
// position: sticky;
left: 0;
width: 150px;
width: 50px !important;
padding: 0 5px;
}
.td-fixed {
// position: sticky;
width: 150px;
width: 50px !important;
padding: 0 5px;
left: 0;
text-decoration: underline;

12
src/router/ebiz/billingDetail.js
View File

@@ -1,5 +1,7 @@
const billingDetail = () => import('@/views/ebiz/billingDetail/billingDetail')
const generateImg = () => import('@/views/ebiz/generateImg/generateImg')
const policyDetails = () => import('@/views/ebiz/billingDetail/policyDetails')
export default [
{
@@ -18,5 +20,13 @@ export default [
meta: {
title: '业绩贺报'
}
}
},
{
path: '/policyDetails',
name: 'policyDetails',
component: policyDetails,
meta: {
title: '保单详情',
}
},
]

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

@@ -1,11 +1,11 @@
<template>
<div style="background: #fff">
<div class="search_col">
<div class="shouButton">
<div class="shouButton" @click="openPopup">
<van-button size="small">{{ outOrderType === 'accept' ? '承保' : '预收' }}</van-button>
</div>
<div class="group">
<van-radio-group class="groups" v-model="dateFlag" direction="horizontal" @change="queryOutOrderListFunc">
<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>
@@ -21,7 +21,8 @@
<van-button size="small" :class="props.checked ? 'checked' : ''">最近一年</van-button>
</template>
</van-radio>
</van-radio-group>
</van-radio-group> -->
<button class="titlebtn">{{ titleText }}</button>
</div>
<div class="icon">
<van-icon name="filter-o" @click="openPopup" />
@@ -40,22 +41,21 @@
</span>-->
<template>
<span v-if="!isJzg" style="margin-right: 10px">
<!-- <span v-if="!isJzg" style="margin-right: 10px">
<span>{{ OrgLvName }}</span>
<!-- <van-icon name="arrow-down" /> -->
</span>
</span> -->
<span @click="isOrgLv2ConditionShow = true">
<span>{{ OrgLv2Name }}</span>
<van-icon name="arrow-down" />
<van-icon size="12" name="arrow-down" />
</span>
<span @click="isOrgLv3ConditionShow = true">
<span>{{ OrgLv3Name }}</span>
<van-icon name="arrow-down" />
<van-icon size="12" name="arrow-down" />
</span>
<span @click="isOrgLv4ConditionShow = true">
<span>{{ OrgLv4Name }}</span>
<van-icon name="arrow-down" />
<van-icon size="12" name="arrow-down" />
</span>
</template>
</div>
@@ -99,6 +99,7 @@
:page-num="pageNum"
@currentChange="currentChange"
@double_click="double_click"
@from-child="double_click"
></tableDetail2>
<!-- </van-list>-->
</div>
@@ -122,11 +123,15 @@
<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>
<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 style="display: flex; align-items: center; justify-content: space-between; justify-items: center; margin-top: 20px">
<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"
@@ -221,6 +226,17 @@
:max-date="timeMaxDate"
/>
</van-popup>
<van-popup v-model="overlayShow" position="bottom" round>
<van-datetime-picker
title="请选择月份"
v-model="currentDate"
type="year-month"
:max-date="maxDate"
:formatter="formatter"
@confirm="confirmChange"
@cancel="cancelChange"
/>
</van-popup>
</div>
</template>
@@ -284,7 +300,7 @@ export default {
timeShow: false,
dialogForm: {
outOrderType: '',
dateFlag: '',
dateFlag: 'all',
startDate: '',
endDate: ''
},
@@ -293,7 +309,7 @@ export default {
dateFlag: '',
style02: 'style02', //style02 时，显示红字红三角的样式，不写的话展示默认样式
currentIndex: 0, //0 当月 1当天
theads: ['序号', '承保时间', '预收时间', '产品名称', '保费', '业务员姓名', '机构'],
theads: ['序号', '承保时间', '预收时间', '产品名称', '保费', '业务员姓名', '机构','查看'],
tableData: [],
total: 0,
maxDate: new Date(),
@@ -333,10 +349,23 @@ export default {
// 1: 中心支公司, 2: 营销服务部, 3: 下辖营业区
queryCom: ''
},
isJzg: false //是否是内勤账号 branchType=JZG 、N 开头的是 (fasle)内勤账号 ；branchType= 数字的是外勤(true)
isJzg: false, //是否是内勤账号 branchType=JZG 、N 开头的是 (fasle)内勤账号 ；branchType= 数字的是外勤(true)
titleText: '全部',
firstTime: true,
monthValue: '',
maxDate: new Date(),
monthDate: new Date(),
overlayShow: false,
}
},
created() {
this.getyaerMonth();
if (this.outOrderType === 'accept') {
this.theads.splice(2,1)
} else {
this.theads.splice(1,1)
}
},
created() {},
mounted() {
// this.getInfo()
let date = new Date()
@@ -358,7 +387,7 @@ export default {
},
openTime(flag) {
this.TimeFlag = flag
this.dialogForm.dateFlag = ''
// this.dialogForm.dateFlag = ''
this.timeShow = true
},
timeConfirm(t) {
@@ -416,6 +445,7 @@ export default {
this.queryOutOrderListFunc()
},
openPopup() {
this.dialogForm = {
outOrderType: this.outOrderType,
dateFlag: this.dateFlag,
@@ -426,6 +456,11 @@ export default {
this.dialogForm.startDate = ''
this.dialogForm.endDate = ''
}
if(this.firstTime == true) {
this.dialogForm.dateFlag = 'all'
this.firstTime = false
}
console.log(this.dialogForm.dateFlag);
this.show = true
},
//时间筛选
@@ -461,10 +496,10 @@ export default {
this.OrgLv3Name = '营业部'
this.OrgLv4Name = '营业组'
} else {
this.OrgLvName = '总公司'
this.OrgLv2Name = '分公司'
this.OrgLv3Name = '中支公司'
this.OrgLv4Name = '支公司'
this.OrgLvName = '全部'
this.OrgLv2Name = '全部'
this.OrgLv3Name = '全部'
this.OrgLv4Name = '全部'
}
const resf = await getMisBranchComList2({
// isJzg: this.isJzg,
@@ -537,11 +572,10 @@ export default {
loadingType: 'spinner',
message: '加载中……'
})
queryOutOrderList({
outOrderType: this.outOrderType, // "accept",//--出单类型 承保 accept 预收 advance
startDate: this.startDate, // "2024-09-01",
endDate: this.endDate, //"2024-09-30",
startDate: this.dialogForm.startDate, // "2024-09-01",
endDate: this.dialogForm.endDate, //"2024-09-30",
dateFlag: this.dateFlag, // -最近一月-m,最近一年y ,全部-all
// appntDate: this.postDate,
distCode: this.OrgLv2Code,
@@ -596,8 +630,8 @@ export default {
// this.params.manageLv = '01'
// }
this.OrgLv2Name = data
this.OrgLv3Name = this.isJzg ? '营业部' : '中支公司'
this.OrgLv4Name = this.isJzg ? '营业组' : '支公司'
this.OrgLv3Name = this.isJzg ? '营业部' : '全部'
this.OrgLv4Name = this.isJzg ? '营业组' : '全部'
this.OrgLv3Code = ''
this.OrgLv4Code = ''
// 点击其他筛选条件-重置当前页为第一页
@@ -632,7 +666,7 @@ export default {
this.OrgLv3Code = ''
}
this.OrgLv4Code = ''
this.OrgLv4Name = this.isJzg ? '营业组' : '支公司'
this.OrgLv4Name = this.isJzg ? '营业组' : '全部'
// this.OrgLv2Code = ''
// this.OrgLv4Code = ''
// 点击其他筛选条件-重置当前页为第一页
@@ -670,6 +704,52 @@ export default {
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
},
typeCheck(e) {
this.dialogForm.dateFlag = e
if(e == 'all') {
this.titleText = '全部'
}if(e == 'm') {
this.overlayShow = true
this.titleText = '按月份查询'
}if(e == 'y') {
this.titleText = '按时间范围查询'
}
},
// 选择月份事件
formatter(type, value) {
if (type === 'year') {
return `${value}年`;
} else if (type === 'month') {
return `${value}月`
}
return value
},
// 月份选择取消按钮
cancelChange() {
this.overlayShow = false
},
// 月份选择确认按钮
confirmChange(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
console.log(y, m)
this.monthValue = y + '-' + m
this.dialogForm.startDate = y + '-' + m + '-' + '01' // "2024-09-01",
this.dialogForm.endDate = y + '-' + m + '-' + '30'//"2024-09-30",
console.log(this.startDate);
})
this.overlayShow = false
}
}
}
@@ -685,7 +765,14 @@ export default {
.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;
@@ -716,7 +803,7 @@ export default {
background: #fff;
}
.table th {
width: 130px;
width: 100px;
}
table {
width: 180vw;
@@ -791,7 +878,7 @@ table {
display: flex;
justify-content: space-between;
.van-button {
padding: 2px 20px;
padding: 2px 10px;
}
}
.timeField {

107
src/views/ebiz/billingDetail/policyDetails.vue Normal file
View File

@@ -0,0 +1,107 @@
<template>
<div class="content">
<!-- 保单详情 -->
<van-collapse v-model="activeName">
<van-collapse-item title="投保单信息" name="1">
<div class="row">
<span class="title">投保单号</span>
<span class="main">{{ policyData.orderNo }}</span>
</div>
<div class="row">
<span class="title">投保日期</span>
<span class="main">{{ policyData.appntDate }}</span>
</div>
<div class="row">
<span class="title">承保日期</span>
<span class="main">{{ policyData.signDate }}</span>
</div>
<div class="row">
<span class="title">总保费</span>
<span class="main">{{ policyData.orderAmount }}元</span>
</div>
</van-collapse-item>
<van-collapse-item title="主险" name="2">
<p class="list" v-show="policyData.mainRiskNameList != []" v-for="(item, index) in policyData.mainRiskNameList" :key="index">{{ item }}</p>
<p class="list" v-show="policyData.mainRiskNameList == []">暂无主险信息</p>
</van-collapse-item>
<!-- subRiskNameList -->
<van-collapse-item title="附加险" name="3">
<p class="list" v-show="policyData.subRiskNameList.length >= 1" v-for="(itemm, index) in policyData.subRiskNameList" :key="index">{{ itemm }}</p>
<p class="list" v-show="policyData.subRiskNameList.length == 0" >暂无附加险信息</p>
</van-collapse-item>
</van-collapse>
</div>
</template>
<script>
import { Collapse, CollapseItem } from 'vant'
import { queryOutOrderDetail } from '@/api/ebiz/billingDetail/billingDetail'
// 当前时间
const currentDate = new Date()
export default {
components: {
[Collapse.name]: Collapse,
[CollapseItem.name]: CollapseItem,
},
data() {
return {
currentDate: '',
orderNo: this.$route.query.orderNo,
activeName: ['1'],
policyData: {},
}
},
created() {
console.log(this.orderNo);
this.getpolicyInfo();
},
mounted() {
},
methods: {
getpolicyInfo() {
queryOutOrderDetail({
orderNo: this.orderNo,
}).then((res) => {
this.policyData = res.content;
})
}
}
}
</script>
<style lang="scss" scoped>
::v-deep .van-cell {
font-size: 18px;
font-weight: 500;
}
::v-deep .van-collapse-item__content {
padding: 0px 35px;
}
.content {
height: 100vh;
background-color: #fff;
}
.row {
display: flex;
align-items: strat;
padding: 7px 0px;
border-bottom: 0.5px #ccc solid;
.title {
width: 150px;
font-size: 16px;
color: #333;
}
.main {
font-size: 14px;
max-width: 200px;
word-break: normal;
display: block;
white-space: pre-wrap;
word-wrap: break-word;
overflow: hidden;
}
}
.list {
padding: 12px 0;
}
</style>

5
src/views/ebiz/generateImg/generateImg.vue
View File

@@ -216,7 +216,10 @@ img {
border: 2px solid;
border-image: radial-gradient(circle, rgba(255, 233, 124, 1), rgba(222, 144, 34, 1)) 2 2;
}
/deep/ .van-button {
border-radius: 12px;
width: 49%;
}
/deep/ .van-button--danger {
background: linear-gradient(to right, #f26e43, #ac0209) !important;
/*设置按钮为渐变颜色*/