<template>
	<view style="padding-bottom: 160rpx;">
		<!-- <view class="price_card">
			<view>账户入股金额</view>
			<view><text class="money">{{shareholder.shareholder_money}}</text>元</view>
		</view> -->
		<!-- <view v-if="!shareholder.is_village" style="text-align: center;color: #aaa;">暂无直属上级公司</view> -->
		<!-- <view class="card" v-else-if="shareholder.is_contract">
			<view class="contract">
				<view class="left">
					<image class="contract_img" src="../../static/img/contract/pdf.png"></image>
					<view class="text">
						<view class="name">《股金合同》</view>
						<view>
							<text>{{shareholder.contract_time}}</text>
						</view>
					</view>
				</view>
				<view class="right" @click="navToContract(shareholder.contract_url)">
					<uni-icons type="paperclip" color="#3274F9"></uni-icons>
					<view>查看</view>
				</view>
			</view>
		</view>
		 -->


		<!-- <view class="need_contract" v-else>
			<button v-if="shareholder.check_status==0" class="btns"
				style="width: 694rpx;height: 90rpx; margin: 0 auto;border-radius: 54rpx;overflow: hidden;background-color: #0122c7;color: #fff;"
				@click="clickContract(1)">
				<u-icon name="../../static/img/company/HT.png" size="20" style="margin-right: 10rpx;"></u-icon>
				发起合同
			</button>
			<view v-if="shareholder.check_status==1">
				<button class="btn tips_center">合同已生成,请等待审核</button>
			</view>
			<view v-if="shareholder.check_status==2" class="card">
				<view class="contract_box send">
					<view class="left">
						<image class="contract_img" src="../../static/img/contract/pdf.png"></image>
						<view class="text">
							<view class="name">《股金合同》</view>
							<view>
								<text>{{shareholder.contract_time}}</text>
							</view>
						</view>
					</view>
					<view class="right" @click="navToContract(shareholder.contract_url)">
						<uni-icons type="paperclip" color="#3274F9"></uni-icons>
						<view>查看</view>
					</view>
				</view>
				<u-line color="#999999FF" style="margin: 31rpx 0;"></u-line>
				<view class="bottom">
					<button class="send_btn" @click="clickContract(2)">发送合同</button>
				</view>
			</view>
			<view v-if="shareholder.check_status==3" class="card">
				<view class="contract_box send">
					<view class="left">
						<image class="contract_img" src="../../static/img/contract/pdf.png"></image>
						<view class="text">
							<view class="name">《股金合同》</view>
							<view>
								<text>{{shareholder.contract_time}}</text>
							</view>
						</view>
					</view>
					<view class="right" @click="navToContract(shareholder.contract_url)">
						<uni-icons type="paperclip" color="#3274F9"></uni-icons>
						<view>查看</view>
					</view>
				</view>
				<u-line color="#999999FF" style="margin: 31rpx 0;"></u-line>
				<view class="bottom">
					<button class="send_btn" @click="getPostsms" v-if="timerCount==0">再次发送短信</button>
					<button class="send_btn tips_center" v-else>{{cTimerCount+'秒后可继续再次发送短信'}}</button>
				</view>
			</view>
		</view> -->





		<view class="card">
			<view class="c_title">账单记录</view>
			<u-line></u-line>
			<u-steps style="padding: 28rpx;" :current="-1" direction="column" activeColor="#0122c7" dot
				inactiveColor="#0122c7">
				<u-steps-item v-for="(item, index) in list" :key="index" :title="item.update_time" :desc="item.remark">
				</u-steps-item>
				<u-loadmore :status="loadConfig.status" :loading-text="loadConfig.loadingText"
					:loadmore-text="loadConfig.loadmoreText" :nomore-text="loadConfig.nomoreText" />
			</u-steps>
		</view>
		<!-- <view class="card">
      <view class="c_title">账单记录</view>
      <u-line></u-line>
      <view class="c_body" v-for="i in 3" :key="i">
        <image class="icon" src="/static/icons/share.png"></image>
        <view class="body_text">
          <view class="b_title">入股金额充值</view>
          <view class="b_text">
            <view class="b_text_left">
              <view>充值账户：</view>
              <image class="b_avatar" src="../../static/img/public/man.png"></image>
              <view>张三三</view>
            </view>
            <view class="b_text_right">+1000.00</view>
          </view>
          <view class="b_time">完成时间：2023-06-15 18:00</view>
        </view>
      </view>
    </view> -->
		<!-- <view class="button">
			<view class="retreat" @click="retreat">退股</view>
			<view class="hand" :class="{'disable': !shareholder.is_done_task || !shareholder.is_contract }"
				@click="hand">上交</view>
		</view> -->
		<!-- <u-modal :show="modelShow" title="提醒" :content="modelType==1?'确定要生成合同吗':'请确认合同无误后再发送'" closeOnClickOverlay
			showCancelButton cancel-text="取消" confirm-text="确认" close="modelShow=false" @cancel="modelShow=false"
			@confirm="modelType==1?createContract():addContract();modelShow=false"></u-modal> -->
	</view>
</template>

<script>
	import {
		Toast
	} from '../../libs/uniApi';
	import {
		download_file
	} from "@/api/junziqian.js"
	import {
		companyAccountLog,
		companyShareholderInfo,
		initiateShareholderContract,
		companyPayShareCapital
	} from "@/api/shareholder.js"
	import {
		companyView,
		initiateContract,
		Draftingcontracts,
		postsms
	} from "@/api/company.js"
	import {
		dictDataLists
	} from "@/api/oaPbulic.js"
	export default {
		data() {
			return {
				shareholder: {
					contract_url: "",
					is_contract: 0,
					is_done_task: 0,
					shareholder_money: "0.00",
					contract_time: "",
					is_amount_turned: ""
				},
				list: [],
				loadConfig: {
					page: 1,
					limit: 25,
					lastpage: '',
					loadingText: '努力加载中',
					loadmoreText: '轻轻上拉',
					nomoreText: '没有更多记录了~~',
					status: 'loadmore'
				},
				timer: null, // 计时器
				timerCount: 0, //倒计时
				modelShow: false,
				modelType: 1,
				nowContractType: 40, //当前合同类型, 40为股金合同
			};
		},
		onLoad(options) {
			this.initInfo();
			this.initLoad();
			let time = uni.getStorageSync('share_time' + this.id);
			if (time > 0 && (time - Date.now()) / 1000 > 0) {
				this.startTimer((time - Date.now()) / 1000);
			}
		},
		onUnload() {
			if (this.timerCount > 0) uni.setStorageSync('share_time' + this.id, this.timerCount * 1000 + Date.now());
		},
		computed: {
			cTimerCount() {
				return this.timerCount;
			}
		},
		async onPullDownRefresh() {
			await this.initLoad();
			uni.stopPullDownRefresh();
		},
		onReachBottom() {
			this.loadList();
		},
		methods: {
			async initInfo() {
				let res = await companyShareholderInfo();
				this.shareholder = res.data;
			},
			async initLoad() {
				this.loadConfig.page = 1;
				this.loadConfig.status = "loadmore";
				this.list = [];
				await this.loadList();
			},
			async loadList() {
				if (this.loadConfig.status == "nomore") return;
				this.loadConfig.status = "loading";
				let res = await companyAccountLog({
					page: this.loadConfig.page,
					limit: this.loadConfig.limit
				})
				this.loadConfig.status = "loadmore"
				if (res.data.list.length < this.loadConfig.limit) {
					this.loadConfig.status = "nomore"
				} else {
					this.loadConfig.page++;
				}
				this.list = [...this.list, ...res.data.list];
			},
			navToContract(contract_no) {
				if (!contract_no) return Toast('暂无合同');
				return uni.navigateTo({
					url: `/subpkg/pdfView/pdfView?url=${contract_no}`
				})
				// download_file({
				//   applyNo: contract_no
				// }).then(res => {
				//   if (res.code != 1) {
				//     uni.hideLoading();
				//     Toast(res.msg)
				//   }
				//   uni.showLoading({
				//     title: '加载中',
				//     mask: true
				//   });
				//   uni.navigateTo({
				//     url: `/subpkg/pdfView/pdfView?url=${res.data.url}`,
				//     fail() {
				//       uni.hideLoading();
				//     }
				//   })
				// })
			},
			retreat() {
				Toast('暂无内容')
			},
			hand() {
				if (!this.shareholder.is_done_task || !this.shareholder.is_contract) return Toast('暂时无法上交');
				this.handShare();
			},
			async handShare() {
				await companyPayShareCapital();
				Toast('上交成功!');
				setTimeout(() => {
					uni.navigateBack();
				}, 1000)

			},
			clickContract(e) {
				this.modelType = e;
				this.modelShow = true;
			},
			// 生成合同
			async createContract(data) {
				uni.showLoading({
					title: '合同生成中',
					mask: true
				})
				let res = await initiateShareholderContract({
					contract_type: this.nowContractType, //股金合同
				})
				this.initInfo();
				uni.hideLoading();
				Toast(res.msg || '合同已生成');
				this.navTo('/subpkg/submit/submit?type=' + 1);
			},
			// 发送合同
			async addContract(data) {
				try {
					uni.showLoading({
						title: '合同发送中',
						mask: true
					})
					let res = await Draftingcontracts({
						id: this.$store.state.app.userInfo.company_id,
						contract_type: this.nowContractType,
					});
					this.initInfo();
					this.startTimer();
					uni.hideLoading();
					Toast('合同已发送');
				} catch (e) {
					uni.hideLoading();
					Toast(e.msg || '合同发送失败');
				}
			},
			// 发送短信
			async getPostsms() {
				try {
					uni.showLoading({
						title: '发送中',
						mask: true
					})
					if (this.timerCount == 0) {
						this.startTimer();
						let res = await postsms({
							id: this.id
						})
						Toast('短信已发送');
						// this.navTo('/subpkg/submit/submit');
					}
				} catch (e) {
					uni.hideLoading();
					Toast(e.msg || '短信发送失败');
				}
			},
			// 定时器
			startTimer(time = 60) {
				this.timerCount = time.toFixed(0);
				this.timer = setInterval(() => {
					this.timerCount--;
					if (this.timerCount <= 0) {
						clearInterval(this.timer);
						this.loadUserDetail();
					}
				}, 1000);
			},
			navTo(url) {
				if (url) {
					uni.showLoading({
						title: '加载中',
						mask: true
					});
					uni.navigateTo({
						url: url,
						success() {
							uni.hideLoading()
						}
					})
				} else Toast('暂未开放')
			},
		}
	}
</script>

<style lang="scss">
	.price_card {
		width: 694rpx;
		height: 180rpx;
		padding: 10rpx 0;
		background: #0022C7;
		margin: 28rpx;
		border-radius: 21rpx;
		color: white;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-evenly;

		.money {
			font-size: 70rpx;
		}
	}

	.card {
		margin: 28rpx;
		width: 694rpx;
		background-color: #fff;
		border-radius: 14rpx;

		.c_title {
			color: #0022C7;
			font-size: 32rpx;
			font-weight: 500;
			padding: 28rpx;
		}

		.c_body {
			margin: 28rpx;
			padding-bottom: 28rpx;
			display: flex;
			border-bottom: 1px solid #F3F4F8;

			&:last-child {
				border-bottom: none;
			}

			.icon {
				width: 77rpx;
				height: 77rpx;
				flex-shrink: 0;
				margin-right: 12rpx;
			}

			.body_text {
				flex: 1;
				font-size: 25rpx;

				.b_title {
					font-size: 32rpx;
					color: #333;
					font-weight: 500;
				}

				.b_text {
					display: flex;
					justify-content: space-between;
					padding: 16rpx 0;
					font-size: 28rpx;

					.b_avatar {
						width: 52rpx;
						height: 52rpx;
						margin-right: 8rpx;
					}

					&_left {
						display: flex;
						align-items: center;
					}

					&_right {
						color: #F02828;
						display: flex;
						align-items: center;
						font-size: 35rpx;
					}
				}

				.b_time {
					color: #666666;
				}
			}
		}

	}

	.button {
		position: fixed;
		bottom: 0;
		left: 0;
		// z-index: 9999999;
		z-index: 1;
		width: 100%;
		border-radius: 0;
		color: #fff;
		height: 90rpx;
		line-height: 90rpx;
		background-color: $theme-oa-color;
		display: flex;

		.retreat {
			color: $theme-oa-color;
			background-color: #fff;
		}

		.hand,
		.retreat {
			flex: 1;
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 32rpx;
		}

		.disable {
			background-color: #666;
			color: #eee;
		}
	}

	.contract {
		display: flex;
		justify-content: space-between;
		padding: 28rpx;

		.left {
			display: flex;

			.contract_img {
				width: 102rpx;
				height: 102rpx;
				background: #f5f5f5;
				border-radius: 14rpx 14rpx 14rpx 14rpx;
				margin-right: 21rpx;
			}

			.text {
				display: flex;
				flex-direction: column;
				justify-content: space-around;

				.name {
					font-size: 32rpx;
					font-weight: 500;
					color: rgba(0, 0, 0, 0.8);
					line-height: 35rpx;
				}

				.nickname {
					margin-right: 35rpx;
				}

				text {
					height: 39rpx;
					font-size: 28rpx;
					font-weight: 400;
					color: #666666;
					line-height: 35rpx;
				}
			}
		}

		.right {
			font-size: 28rpx;
			font-weight: 500;
			color: $theme-oa-color;
			line-height: 35rpx;
			display: flex;
			justify-content: center;
			align-items: center;

			.icon {
				width: 35rpx;
				height: 39rpx;
				background-color: $theme-oa-color;
				opacity: 1;
				margin-right: 10rpx;
			}
		}
	}

	.need_contract {
		// padding-bottom: 30rpx;

		.title {
			font-size: 35rpx;
			font-weight: 500;
			color: #333333;
			margin-bottom: 21rpx;
			margin-left: 28rpx;
		}

		.card {
			padding-top: 0;
			margin: 28rpx;
			padding: 28rpx;
			background-color: #fff;
			border-radius: 14rpx;

			.contract_box {
				display: flex;
				justify-content: space-between;

				.left {
					display: flex;

					.contract_img {
						width: 102rpx;
						height: 102rpx;
						background: #F5F5F5;
						border-radius: 14rpx 14rpx 14rpx 14rpx;
						margin-right: 21rpx;
					}

					.text {
						display: flex;
						flex-direction: column;
						justify-content: space-between;

						.name {
							font-size: 32rpx;
							;
							font-weight: 500;
							color: rgba(0, 0, 0, 0.8);
							line-height: 35rpx;
						}

						.nickname {
							margin-right: 35rpx;
						}

						text {
							height: 39rpx;
							font-size: 28rpx;
							font-weight: 400;
							color: #666666;
							line-height: 35rpx;
						}
					}
				}

				.right {
					font-size: 28rpx;
					font-weight: 500;
					color: #3274F9;
					line-height: 35rpx;
					display: flex;
					justify-content: center;
					align-items: center;

					.icon {
						width: 35rpx;
						height: 39rpx;
						background-color: #3274F9;
						opacity: 1;
						margin-right: 10rpx
					}
				}

			}


			.send_btn {
				width: 100%;
				height: 84rpx;
				background: $theme-oa-color;
				border-radius: 42rpx 42rpx 42rpx 42rpx;
				color: #fff;
				line-height: 80rpx;
				text-align: center;
			}

			.tips_center {
				background-color: #666;
				color: #eee;
			}
		}

		.btn {
			margin: 0 auto;
			margin-top: 32rpx;
			// margin-bottom: 40rpx;
			width: 694rpx;
			height: 84rpx;
			background: $theme-oa-color;
			border-radius: 42rpx 42rpx 42rpx 42rpx;
			color: #fff;
			line-height: 80rpx;
			text-align: center;
		}

		.tips_center {
			background-color: #666;
			color: #eee;
		}
	}

	.btns {
		color: white;
		background-color: $theme-oa-color;
		display: flex;
		justify-content: center;
		align-items: center;
	}
</style>