大单帮修改以及接口对接

This commit is contained in:
liu.xiaofeng@ebiz-digits.com
2024-01-10 15:41:01 +08:00
parent a934a5bab6
commit ae09ce6509
2 changed files with 274 additions and 165 deletions

View File

@@ -90,3 +90,11 @@ export function queryOutPosters(data) {
}) })
} }
//大单榜海报列表接口
export function queryOutPostersBig(data) {
return request({
url: getUrl(`/sale/makePosters/queryOutPostersBig`, 1),
method: 'post',
data
})
}

View File

@@ -1,200 +1,301 @@
<template> <template>
<div class="wrapper"> <div class="good-start-scheme bg-white">
<div v-if="posterList.length !== 0"> <div v-if="isShow == true">
<van-grid :column-num="3" :gutter="5"> <div class="flex justify-content-s pt10 pb15">
<van-grid-item v-for="(item, index) in posterList" :key="index" @click="previewImg(item, index)"> <div class="fs12 bntTab">
<van-image class="fill" :src="item.posterUrl" /> <span :class="[active == 'appnt' ? 'tab' : 'unTab']" @click="tabChange('appnt')">预收</span>
</van-grid-item> <span :class="[active == 'sign' ? 'tab' : 'unTab']" @click="tabChange('sign')">承保</span>
</van-grid> </div>
<div class="pageWrapper"> <div>
<van-pagination class="bottom-btn" v-model="pageNum" :page-count="totalPage" @change="pageChange" /> <div @click="timePopup" class="fs12 red h30 mt5 mr15">
{{ titleTime }}
<img src="@/assets/images/u79.png" alt class="ml5" />
</div>
</div>
</div> </div>
<van-image-preview id="preview" v-model="isPrevShow" :images="images" :start-position="startPosition" @change="onPageChange" /> <div v-if="pics.length">
<div class="flex justify-content-s bottom-btn bottom15 border-color" v-show="isPrevShow"> <van-grid :column-num="3">
<van-button square type="default" size="large" @click="shareImg" v-no-more-click="1000"> 分享 </van-button> <van-grid-item v-for="(pic, i) in pics" :key="i">
<van-button square type="danger" size="large" @click="downLoadImagesFunc" v-no-more-click="1000"> 下载 </van-button> <van-image height="200" :src="pic.posterUrl" @click="prevImg(pic, i)" />
</van-grid-item>
</van-grid>
<van-image-preview id="preview" v-model="isPrevShow" :images="images" :start-position="startPosition" @change="onPageChange" />
<!-- <van-button class="share-btn" v-show="isPrevShow" type="danger" block @click="shareImg">分享</van-button> -->
<div class="flex justify-content-s bottom-btn bottom15 border-color" v-show="isPrevShow">
<van-button square type="default" size="large" @click="shareImg" v-no-more-click="1000"> 分享 </van-button>
<van-button square type="danger" size="large" @click="downLoadImagesFunc" v-no-more-click="1000"> 下载 </van-button>
</div>
</div> </div>
</div> </div>
<div v-if="posterList.length === 0" class="text-center"> <!-- {{isShow}} {{pics.length}} -->
<div v-if="isShow == false || pics.length == '0'" class="text-center height100vh">
<img class="mt40 w250" src="@/assets/images/pic_page-non.png" /> <img class="mt40 w250" src="@/assets/images/pic_page-non.png" />
<div class="fs17 c-gray-dark mt40">暂无数据</div> <div class="fs17 c-gray-dark mt40" v-if="isShow == false">您暂无使用权限</div>
<div class="fs17 c-gray-dark mt40" v-if="isShow == true && pics.length == '0'">暂无数据</div>
</div> </div>
<!-- 筛选年月日 -->
<van-popup v-model="dateShow" position="bottom">
<van-datetime-picker v-model="currentDate" type="date" title="选择日期" :min-date="minDate" :max-date="maxDate" @cancel="handleCancel" @confirm="handleEndDateConfirm"/>
</van-popup>
</div> </div>
</template> </template>
<script> <script>
import { Sticky, Grid, GridItem, Pagination, ImagePreview, List, Image } from 'vant' import { Grid, GridItem, Image, ImagePreview, Pagination } from 'vant'
import { queryBigPosters } from '@/api/ebiz/poster/poster' import { queryOutPostersBig, getBranchByUser} from '@/api/ebiz/goodStart'
// import config from '@/config' import { getAgentInfo} from '@/api/ebiz/my/my.js'
import Vue from 'vue' import utils from '@/assets/js/utils/date-utils'
import Vue from 'vue'
Vue.use(ImagePreview) // 全局注册
export default { Vue.use(ImagePreview)
name: 'posterList', export default {
components: { components: {
[Sticky.name]: Sticky, [Grid.name]: Grid,
[Grid.name]: Grid, [GridItem.name]: GridItem,
[GridItem.name]: GridItem, [Image.name]: Image,
[Pagination.name]: Pagination, [Pagination.name]: Pagination
[List.name]: List,
[Image.name]: Image
},
data() {
return {
// posterType: 'hb',
srcUrl: '@/images/u10199.png',
pageNum: 1,
pageSize: 9,
posterList: [], // 贺报列表
realImgUrls: [],
// index: 0,
totalPage: 0,
isPrevShow: false,
startPosition: 0,
currentPage: 0,
}
},
computed: {
images() {
const picArr = []
for (let pic of this.posterList) {
picArr.push(pic.posterUrl)
}
return picArr
}
},
created() {
this.getPostList()
},
methods: {
onPageChange(index) {
this.currentPage = index
}, },
// 贺报列表查询 data() {
async getPostList() { return {
let param = { dateShow: false,
// posterInfoDTO: { minDate: new Date('2020-01-01'),
// posterType: this.posterType maxDate: new Date(),
// }, currentDate: new Date(),
pageNum: this.pageNum, titleTime:'', //筛选时间
pageSize: this.pageSize isFromService: '',
isPrevShow: false,
currentPage: 0,
pics: [],
startPosition: 0,
branchType:'', //以N打头的是内勤 其他是外勤0: 外勤1: 内勤
isShow:false, //是否有权限查看
manageLv:null,
active:'appnt'
} }
this.$toast.loading({ },
message: '加载中...', computed: {
forbidClick: true, images() {
loadingType: 'spinner' const picArr = []
}) for (let pic of this.pics) {
let res = await queryBigPosters(param) picArr.push(pic.posterUrl)
if (res.result == 0) {
this.realImgUrls.splice(0)
this.totalPage = res.content.pages
this.posterList = res.content.list
for (let item of this.posterList) {
// let narrowUrl = (config.imgDomain + `/returnImageStream?a=b.jpg&imgPath=${item.posterNarrowUrl}`).replace(/\+/g, '%2B')
// let url = (config.imgDomain + `/returnImageStream?a=b.jpg&imgPath=${item.posterUrl}`).replace(/\+/g, '%2B')
// item.narrowUrl = narrowUrl
this.realImgUrls.push(item.posterUrl)
} }
} else { return picArr
this.$toast(res.resultMessage)
} }
}, },
previewImg(item, index) { created() {
// this.isPrevShow = true // this.isFromService = this.$route.query.from === 'service'
// ImagePreview({ this.titleTime = utils.formatDate(new Date(), 'yyyy-MM-dd')
// images: this.realImgUrls, this.getAgentInfoFunc()
// startPosition: index this.getBranchByUserFunc()
// }) // this.interceptAppBtn()
this.isPrevShow = true
this.startPosition = index
}, },
pageChange(pageNum) { methods: {
this.pageNum = pageNum //选择当月时间
this.getPostList() seceltCurrentMonth() {
}, this.titleTime = utils.formatDate(new Date(), 'yyyy-MM-dd')
shareImg() { this.queryOutPostersBig()
console.log(this.images[this.currentPage]) },
// eslint-disable-next-line no-undef timePopup() {
EWebBridge.webCallAppInJs('bridge', { this.dateShow = true
flag: 'share', },
extra: { handleCancel() {
shareType: '1', this.dateShow = false
img: this.images[this.currentPage] },
//tab按钮切换
tabChange(active) {
this.active = active
this.queryOutPostersBig()
},
//点击筛选年月日--点击确认
handleEndDateConfirm(e) {
this.dateShow = false
this.titleTime = utils.formatDate(e, 'yyyy-MM-dd')
this.queryOutPostersBig()
},
// 获取代理人信息,区分内外勤
async getAgentInfoFunc() {
const res = await getAgentInfo({})
if (res.result == 0) {
// res.branchType 以N打头的是内勤 其他是外勤0: 外勤1: 内勤
this.branchType = /^N{1}/.test(res.branchType) ? '1' : '0'
} else {
return this.$toast(res.resultMessage)
} }
}) },
}, //获取当前人机构
// 原生下载图片的方法 async getBranchByUserFunc(){
downLoadImagesFunc() { let resData = await getBranchByUser({})
if (this.images[this.currentPage]) { // 内勤一、二、三 级暂无使用权限
this.manageLv = resData.content.level?Number(resData.content.level.substr(1, 1)):9
if(this.manageLv == 4 || this.manageLv == 5 ||this.manageLv == 6 ||this.manageLv == 7 ||this.manageLv == 8 ||this.manageLv == 9){
this.isShow = true //是否有权限查看
this.queryOutPostersBig()
}
},
prevChange(index) {
this.startPosition = index
},
interceptAppBtn() {
setTimeout(() => {
// eslint-disable-next-line no-undef
EWebBridge.webCallAppInJs('webview_left_button', {
intercept: '1'
})
}, 100)
window.appCallBack = this.appCallBack
},
appCallBack(data) {
if (data.trigger == 'left_button_click') {
if (!this.isPrevShow) {
if (this.isFromService) {
this.$jump({
flag: 'service'
})
} else {
this.$jump({
flag: 'h5',
extra: {
title: '开门红专区',
forbidSwipeBack: 1,
url: location.origin + `/#/goodStart/prefecture`
},
routerInfo: {
path: `/goodStart/prefecture/prefecture`,
type: '1'
}
})
}
} else {
this.isPrevShow = false
}
}
},
onPageChange(page) {
this.currentPage = page
},
async queryOutPostersBig() {
const param = {
appntType: this.active,
appntMonth: this.titleTime
}
const result = await queryOutPostersBig(param)
if (result.result === '0') {
this.pics = result.content.list
} else {
this.$toast(result.resultMessage)
}
},
prevImg(pic, i) {
this.isPrevShow = true
this.startPosition = i
},
shareImg() {
console.log(this.images[this.currentPage])
// eslint-disable-next-line no-undef // eslint-disable-next-line no-undef
EWebBridge.webCallAppInJs('download', { EWebBridge.webCallAppInJs('bridge', {
name: '开门红方案.png', flag: 'share',
url: this.images[this.currentPage] extra: {
}).then(() => { shareType: '1',
console.log('下载完成') img: this.images[this.currentPage]
}).catch(() => { }
this.$toast.fail('图片下载失败,请重新下载!')
}) })
} else { },
this.$toast.fail('图片下载失败,请重新下载!') // 原生下载图片的方法
downLoadImagesFunc() {
if (this.images[this.currentPage]) {
// eslint-disable-next-line no-undef
EWebBridge.webCallAppInJs('download', {
name: '开门红方案.png',
url: this.images[this.currentPage]
})
.then(() => {
console.log('下载完成')
})
.catch(() => {
this.$toast.fail('图片下载失败,请重新下载!')
})
} else {
this.$toast.fail('图片下载失败,请重新下载!')
}
} }
} }
} }
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
/deep/ .van-grid-item { .height100vh{
height: 30vh; height: 100vh;
} }
.good-start-scheme {
padding-bottom: 20px;
}
/deep/ .fill { /deep/ .van-grid-item__content {
height: 100%; padding: 5px;
} }
.wrapper { .share-btn {
padding-top: 12px; position: fixed;
padding-bottom: 50px; bottom: 0;
} z-index: 10000;
}
.post-container { /deep/ .van-image-preview__image {
display: flex; bottom: auto;
flex-wrap: wrap; }
justify-content: start;
}
.post { /deep/ .van-pagination__item {
width: 28vw; color: #ff0033;
padding: 3px; }
background: #fff;
margin: 5px;
}
img { /deep/ .van-pagination__item--active {
max-width: 100%; background-color: #ff0033;
} color: #fff;
}
/deep/ .van-list__loading, #pagination {
/deep/ .van-list__finished-text { position: fixed;
width: 100%; bottom: 0;
} left: 0;
right: 0;
}
/deep/ .van-pagination__item { .border-color {
color: #ff4040; z-index: 9999;
} border: 2px solid;
border-image: radial-gradient(circle, rgba(255, 233, 124, 1), rgba(222, 144, 34, 1)) 2 2;
}
/deep/ .van-button--danger {
background: linear-gradient(to right, #f26e43, #ac0209) !important; /*设置按钮为渐变颜色*/
border: none !important;
}
/deep/.van-pagination__item:active, // 顶部tab按钮
/deep/.van-pagination__item--active { .bntTab {
background-color: #ff4040; text-align: center;
color: #fff; .tab {
} background: red;
.border-color { color: #fff;
z-index: 9999; border-radius: 14px;
border: 2px solid; width: 64px;
border-image: radial-gradient(circle, rgba(255, 233, 124, 1), rgba(222, 144, 34, 1)) 2 2; height: 26px;
} line-height: 26px;
/deep/ .van-button--danger { display: inline-block;
background: linear-gradient(to right, #f26e43, #ac0209) !important; /*设置按钮为渐变颜色*/ text-align: center;
border: none !important; margin-left: 10px;
} }
.unTab {
background-color: #fff;
color: #333;
border: 1px solid #c1c1c1;
border-radius: 14px;
width: 64px;
height: 26px;
line-height: 26px;
display: inline-block;
text-align: center;
margin-left: 10px;
}
}
</style> </style>