<template>
	<ciy-header :title="init.code==1?init.section.name:'文章详情'" ref="header"></ciy-header>
	<view v-if="init.code != 1" class="px4 py4">
		<view class="ciy-skeleton" style="height:2em;width:100%;"></view>
		<view class="ciy-skeleton" style="height:1em;width:60%;"></view>
		<view class="ciy-skeleton" style="height:10em;width:100%;"></view>
	</view>
	<view v-else class="bg1 flex flexcol" :style="'height:calc(100vh - ' + (header_statusbar_height+header_title_height) + 'px);'">
		<scroll-view @scrolltolower="chglower" class="flex1" style="overflow: auto;" scroll-y>
			<view class="txt-lg txt-center txt-wb py3">{{init.data.name}}</view>
			<view class="flex py1 txt-sm" style="flex-wrap: wrap;justify-content: space-evenly;">
				<view v-if="init.data.source">来源 {{init.data.source}}</view>
				<view v-if="init.data.author">作者 {{init.data.author}}</view>
				<view v-if="init.data.readcnt>100">热度 {{init.data.readcnt + init.data.studycnt}}</view>
			</view>
			<view class="ciy-hr"></view>
			<ciy-markdown :md="init.data.content"></ciy-markdown>
		</scroll-view>
		<view class="bg2" style="border-top:1px solid var(--bg5)">
			<form @submit="submitsend">
				<view class="flex flex-center">
					<!-- <view><button class="btn def" @tap="sendimg">图片</button></view> -->
					<view class="flex1"><ciy-textarea name="content" v-model="content" ciystyle="min-height:1em;padding:0.5em"></ciy-textarea></view>
					<view><button form-type="submit" :disabled="init.vent" class="btn">吐槽</button></view>
				</view>
			</form>
		</view>
		<view class="bg2" :style="{height:footer_safe_height+'px'}"></view>
	</view>
</template>

<style>
</style>

<script>
	export default {
		data() {
			return {
			}
		},
		onLoad() {
			this.getinit();
			this.readtimes = this.tostamp();
			this._tout = setTimeout(() => {
				this.chglower();
			}, 5000);
		},
		onUnload(opn) {
			if (this._tout)
				clearTimeout(this._tout);
		},
		watch: {},
		computed: {},
		methods: {
			async getinit() {
				var retjson = await this.callajax({
					func: 'index.art_read',
					data: this.pagepost
				});
				if (retjson.code != 1)
					return this.alert(retjson.errmsg);
				this.init = retjson;
			},
			chglower(e) {
				if (this._hot)
					return;
				this._hot = true;
				this.pagepost.sec = this.tostamp() - this.readtimes;
				this.callajax({
					func: 'index.art_hot',
					data: this.pagepost
				});
			},
			async submitsend(e) {
				if (!e.detail.value.content)
					return this.toast('请输入内容');
				e.detail.value.sectionid = this.init.section.id;
				e.detail.value.id = this.opn.id;
				if (this._loading)
					return;
				this._loading = true;
				var retjson = await this.callajax({
					func: 'index.art_vent',
					data: e.detail.value
				});
				this._loading = false;
				if (retjson.code != 1)
					return this.alert(retjson.errmsg);
				this.init.vent = true;
			}
		}
	}
</script>