xuan-pay-cweb/pages/index/equity-activities-details/equity-activities-details.vue

<template>
	<view>
		<view class="width94 font20 fontwig6 fcor333 mart15 fotct">{{activitydetails.activityName}}</view>
		<view class="width94 font16 fcor666 mart10 fotct">{{activitydetails.comments}}</view>
		<view class="width90 font13 fcoreb5 mart15 alijusstart">
			活动时间:
			{{activitydetails.effectiveStart | timeFormat('yyyy-mm-dd')}} -
			{{activitydetails.effectiveEnd | timeFormat('yyyy-mm-dd')}}
		</view>
		<view class="width90 font13 fcoreb5 alijusstart">
			报名时间: {{activitydetails.registrationStart | timeFormat('yyyy-mm-dd')}} -
			{{activitydetails.registrationEnd | timeFormat('yyyy-mm-dd')}}
		</view>
		<view class="width90 fcoreb5 font14 fontwig6 mart5" v-if="activitydetails.bankActivityRoster !=null">已报名
		</view>
		<view class="width90 fcor666 font14 fontwig6 mart5" v-else>未报名</view>
		<view class="width100 backcor6 mart5" style="height: 1px;"></view>
		<view class="width90 mart20">
			<rich-text :nodes="activitydetails.details"></rich-text>
		</view>

		<view class="width90 mart20 marb15 fcor333 fontwig6 font16" v-if="activitydetails.bankActivityRoster ==null">
			商户信息
		</view>
		<template v-if="merDetailInfo">
			<view class="username">
				<view class="namecont">商户名称</view>
				<view class="font14 fcor333 text2 width75 fotrt">{{merDetailInfo.mer.merName}}</view>
			</view>
			<view class="username">
				<view class="namecont">支行名称</view>
				<view class="font14 fcor333 text2 width75 fotrt">{{merDetailInfo.mer.merSettleAcct.openningBankName}}</view>
			</view>
			<view class="username">
				<view class="namecont">支行行号</view>
				<view class="font14 fcor333 text2 width75 fotrt">{{merDetailInfo.mer.merSettleAcct.openningBankCode}}</view>
			</view>
		</template>
		<!-- <view class="username">
			<view class="namecont">银行地址</view>
			<pickRegions :defaultRegion="defaultRegionCodes" class="width70" @getRegion="handleBankCityCode">
				<view style="color: #333333;font-size:14px;padding-top:2px;	text-align: right;padding-right: 10px;"
					v-if="bankregionName">
					{{bankregionName}}
				</view>
				<view style="color: #bfbfbf;font-size:14px;padding-top:2px;	text-align: right;padding-right: 10px;"
					v-else>请选择银行地址</view>
			</pickRegions>
			<image src="../../../static/img/jtg.png" mode="widthFix" class="iconw"></image>
		</view> -->

		<!-- <view class="username">
			<view class="namecont">所属支行</view>
			<input placeholder="请选择所属支行" v-model="belongbranch" style="width: 70%;" disabled="true"
				placeholder-style="color: #bfbfbf;font-size:14px;padding-top:2px;" />
			<image src="../../../static/img/jtg.png" mode="widthFix" class="iconw" @click="showdepositaryBank()">
			</image>
		</view> -->



		<view class="width90 mart20 marb15 fcor333 fontwig6 font16" v-if="activitydetails.bankActivityRoster !=null">
			选择周期费率
			<text class="fcoreb5"
				v-if="activitydetails.bankActivityRoster.bankActivityRosterRateList[0].status == 1">(已生效)</text>
			<text class="fcoreb5"
				v-if="activitydetails.bankActivityRoster.bankActivityRosterRateList[0].status == 2">(未配置)</text>
		</view>
		<view class="username" v-for="(item,index) in activityList" :key="index">
			<view class="namecont">
				{{item.startTime | timeFormat('yyyy-mm-dd')}} 至 {{item.endTime | timeFormat('yyyy-mm-dd')}}
			</view>
			<picker mode="selector" style="width: 30%;" :range="item.rateArray" @change="changefeil"
				@click="changefeilvalue(item)">
				<!-- <view class="fotrt text1" style="padding: 0 25rpx;"></view> -->
				<input  v-model="item.ext1" />
			</picker>
			<image class="flright iconw" mode="widthFix" src="../../../static/img/downj.png"></image>
		</view>

		<button class="btns" @click="enrollActivity" v-if="activitydetails.bankActivityRoster ==null">提交审核</button>
		<button class="btns" @click="configRosterRate" v-else>提交费率</button>
		<view class="height60"></view>
	</view>
</template>

<script>
	import {
		queryActivityDetail,
		enrollActivity,
		configRosterRate,
		getSettleAcctByMer
	} from '../../../Utils/Api.js';
	import pickRegions from '../../../components/pick-regions/pick-regions.vue';
	let app = getApp();
	export default {
		components: {
			pickRegions
		},
		data() {
			return {
				activitydetails: '', //活动数据
				detailsid: '', // 详情id
				merId: '', //商户id
				activityList: [], // 所有费率
				changeValue: '', //选择的值
				region: [], //选择区域
				defaultRegion: ['北京市', '市辖区', '东城区'], //默认地区
				defaultRegionCodes: '110101', //区级编号
				bankareaCode: '', //开户行市区编号
				bankregionName: '', //开户行名字
				belongbranch: '', //所属支行
				branchBankNo: '', //所属支行编号
				merDetailInfo: '' //商户信息
			}
		},
		onLoad(options) {
			this.detailsid = options.id;
			this.merId = options.merid;
			this.queryActivityDetail();
			this.getSettleAcctByMer();
		},
		onShow() {
			if (app.globalData.depositaryBank) {
				this.belongbranch = app.globalData.depositaryBank;
			}
			if (app.globalData.branchBankNo) {
				this.branchBankNo = app.globalData.branchBankNo;
			}
		},
		onUnload() {
			app.globalData.depositaryBank = '';
			app.globalData.bankareaCode = '';
			app.globalData.branchBankNo = '';
			app.globalData.clearNo = '';
		},
		methods: {
			//查询商户信息
			getSettleAcctByMer() {
				let datas = {
					merId: this.merId
				}
				getSettleAcctByMer(datas).then(res => {
					if (res.return_code == '000000') {
						this.merDetailInfo = res.return_data;
						this.branchBankNo = res.return_data.mer.merSettleAcct.openningBankCode;
					} else {
						uni.showToast({
							title: res.return_msg,
							duration: 2000,
							icon: 'none'
						})
					}
				})
			},
			//选择开户行
			handleBankCityCode(region) {
				this.region = region;
				this.bankareaCode = this.region.map(item => item.code)[2];
				this.bankregionName = this.region.map(item => item.name).join('-');
				app.globalData.bankareaCode = this.bankareaCode;
			},
			//选择卡号
			changefeil(e) {
				let query = e.target.value;
				if (this.changeValue) {
					for (var i = 0; i < this.activityList.length; i++) {
						if (this.changeValue.id == this.activityList[i].id) {
							this.activityList[i].ext1 = this.activityList[i].rateArray[query];
						}
					}
				}
			},
			//选择支行
			showdepositaryBank() {
				if (!this.bankareaCode) {
					uni.showToast({
						title: '请选择地区',
						duration: 2000,
						icon: 'none'
					})
					return;
				}
				uni.navigateTo({
					url: '/pages/index/depositaryBank/depositaryBank'
				})
			},
			changefeilvalue(item) {
				this.changeValue = item;
			},
			//查询活动详情
			queryActivityDetail() {
				uni.showLoading({
					title: '加载中'
				})
				let datas = {
					bankActivityId: this.detailsid,
					merId: this.merId
				}
				queryActivityDetail(datas).then(res => {
					uni.hideLoading();
					if (res.return_code == '000000') {
						this.activitydetails = res.return_data;
						if (res.return_data.bankActivityRoster) {
							this.activityList = res.return_data.bankActivityRoster
								.bankActivityRosterRateList
						}

					} else {
						uni.showToast({
							title: res.return_msg,
							duration: 2000,
							icon: 'none'
						})
					}
				})
			},
			//提交报名
			enrollActivity() {
				let that = this;
				uni.showModal({
					title: '报名申请',
					content: '是否提交报名审核',
					success: (res) => {
						if (res.confirm) {
							uni.showLoading({
								title: '提交审核中...'
							})
							let datas = {
								bankActivityId: that.detailsid,
								branchBankNo: that.branchBankNo,
								merId: that.merId
							}
							enrollActivity(datas).then(res => {
								uni.hideLoading();
								if (res.return_code == '000000') {
									uni.showToast({
										title: res.return_data,
										duration: 2000,
										icon: 'none'
									})
									that.queryActivityDetail();
								} else {
									uni.showToast({
										title: res.return_msg,
										duration: 3000,
										icon: 'none'
									})
								}
							})

						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			},
			//提交费率
			configRosterRate() {
				let that = this;
				uni.showModal({
					title: '费率提交',
					content: '是否提交当前费率',
					success: (res) => {
						if (res.confirm) {
							uni.showLoading({
								title: '加载中'
							})
							let rateDatas = [];
							for (var i = 0; i < that.activityList.length; i++) {
								if (that.activityList[i].ext1) {
									let datas = {
										"rateId": that.activityList[i].id,
										"preferentialRates": that.activityList[i].ext1
									}
									rateDatas.push(datas);
								}
							}
							let datas = {
								"bankActivityId": that.detailsid,
								"merId": that.merId,
								"rateList": rateDatas
							}
							configRosterRate(datas).then(res => {
								uni.hideLoading();
								if (res.return_code == '000000') {
									uni.showToast({
										title: res.return_data,
										duration: 2000,
										icon: 'none'
									})
									uni.navigateBack();
								} else {
									uni.showToast({
										title: res.return_msg,
										duration: 2000,
										icon: 'none'
									})
								}
							})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			}
		}
	}
</script>

<style lang="scss">
	.btns {
		margin-top: 80rpx;
		width: 80%;
		margin-left: 10%;
		height: 50px;
		line-height: 50px;
		background-color: #0083f5;
		color: #FFFFFF;
		font-weight: bold;
	}

	.username {
		width: calc(100% - 90upx);
		height: 40px;
		display: flex;
		align-items: center;
		background-color: rgba($color: #ffffff, $alpha: 0.1);
		border-bottom: 1px solid #f6f6f6;
		padding: 5px 20px;

		input {
			// width: 50%;
			// height: 50upx;
			// font-size: 16px;
			// color: #333333;
			// font-weight: blod;
			text-align: right;
			padding-right: 10px;
		}


		.namecont {
			color: #666666;
			width: 60%;
		}
	}
</style>