<template>
	<!-- 活动题 -->
	<view class="activity-area" v-model="questionData">
		<view class="question_title">
			<text class="question_number">
				{{ questionNumberEndIsBracket(questionData.property.question_number) }}
			</text>
			<text class="question_stem" v-html="sanitizeHTML(questionData.stem)"
				:ref="'richText-1-1'+questionData.question_id"
				@longpress="previewByRichTextImg(-1,-1,questionData.question_id)"></text>
		</view>
		<view class="description" v-html="sanitizeHTML(questionData.description)"
			v-if="isEnable(questionData.property.is_enable_description)&&questionData.description.length > 0"
			:ref="'richText-2-2'+questionData.question_id" @longpress="previewByRichTextImg(-2,-2,questionData.question_id)">
		</view>
		<!-- 上传文件 -->
		<UploadFiles upload-title="" :disabled="answer_control[questionData.question_id].isReadOnly"
			:fileIdList="uploadedIdList" @upload="handleUpload" @deleteFile="handleDelete">
		</UploadFiles>
	</view>
</template>

<script>
	import {
		questionData,
		sanitizeHTML,
		isEnable,
		answer_control,
	} from '@/pages/answer_question/common/data/common.js';
	import UploadFiles from '@/components/upload-files/upload-files.vue';
	import AnswerControlMixin from '@/pages/answer_question/common/data/AnswerControlMixin.js';
	export default {
		name: "activity-question",
		mixins: [AnswerControlMixin],
		components: {
			UploadFiles
		},
		props: {
			questionData: questionData
		},
		data() {
			return {
				sanitizeHTML,
				isEnable,
				answer_control,
				uploadedIdList: [],
				question_id: '',
			};
		},
		watch: {
			'questionData.question_id': {
				handler(val) {
					this.questionData.user_answer[val].answer_list = [{
						accessory_file_id_list: [], // 上传文件列表
					}]
					this.question_id = this.questionData.question_id;
					this.setUserAnswer();
					this.commonComputedAnswerControl(val);
				},
				immediate: true,
				deep: true
			}
		},
		methods: {
			// 文件上传成功
			handleUpload(fileId) {
				this.questionData.user_answer[this.question_id].answer_list[0].accessory_file_id_list.push(fileId);
				this.setQuestionEdit();
			},
			// 删除文件
			handleDelete(fileId) {
				if (this.answer_control[this.questionData.question_id].isReadOnly) return;
				var i = this.questionData.user_answer[this.question_id].answer_list[0].accessory_file_id_list
					.indexOf(fileId);
				if (i > -1)
					this.questionData.user_answer[this.question_id].answer_list[0].accessory_file_id_list.splice(i,
						1);
				this.setQuestionEdit();
			},
			setQuestionEdit() {
				this.questionData.user_answer[this.question_id].isEdit = true;
				this.$forceUpdate();
			},
			//获取用户答案
			setUserAnswer: function() {
				var that = this;
				var callback = function() {
					that.questionData.user_answer[that.question_id].answer_list[0].accessory_file_id_list.forEach(
						p => {
							that.uploadedIdList.push(p);
						})

					that.$forceUpdate();
				}
				this.$emit("getUserAnswer", this.question_id, callback);
			},

		}
	}
</script>

<style lang="scss" scoped>
	.activity-area {}
</style>