|
|
@@ -1,16 +1,185 @@
|
|
|
<template>
|
|
|
- <div class="reportCustom">reportCustom</div>
|
|
|
+ <div class="reportCustom" v-if="fromData && fromData.length">
|
|
|
+ <van-form ref="tabstoreVal">
|
|
|
+ <template v-for="value in fromData">
|
|
|
+ <template v-if="value.sfaReportCustomCollections">
|
|
|
+ <div v-for="(item, index) in value.sfaReportCustomCollections" :key="index">
|
|
|
+ <div v-if="item.answerType == 'sz'" class="formLabel z-cell">
|
|
|
+ <van-cell>
|
|
|
+ <template #title>
|
|
|
+ <span v-if="item.isMust == 0" class="van-f-red">*</span>
|
|
|
+ {{ 1 + index + '.' }}
|
|
|
+ {{ item.customName }}
|
|
|
+ </template>
|
|
|
+ </van-cell>
|
|
|
+ <van-field
|
|
|
+ v-model="item.answerValue"
|
|
|
+ :placeholder="item.remark"
|
|
|
+ type="number"
|
|
|
+ :disabled="!item.allowWriteAgain"
|
|
|
+ @input="numberFn(item, index)"></van-field>
|
|
|
+ </div>
|
|
|
+ <div v-if="item.answerType == 'rq'" class="formLabel z-cell">
|
|
|
+ <van-cell>
|
|
|
+ <template #title>
|
|
|
+ <span v-if="item.isMust == 0" class="van-f-red">*</span>
|
|
|
+ {{ 1 + index + '.' }}
|
|
|
+ {{ item.customName }}
|
|
|
+ </template>
|
|
|
+ </van-cell>
|
|
|
+ <van-field
|
|
|
+ v-model="item.answerValue"
|
|
|
+ clickable
|
|
|
+ name="calendar"
|
|
|
+ placeholder="点击选择日期"
|
|
|
+ readonly
|
|
|
+ :disabled="!item.allowWriteAgain"
|
|
|
+ @click="showCalendarClick(item, index)" />
|
|
|
+ <p
|
|
|
+ v-if="item.allowWriteAgain"
|
|
|
+ style="color: #444; font-size: 12px; margin: 0; padding: 10px 0; text-align: right">
|
|
|
+ {{ item.remark }}
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ <div v-if="item.answerType == 'wb'" class="formLabel z-cell">
|
|
|
+ <van-cell>
|
|
|
+ <template #title>
|
|
|
+ <span v-if="item.isMust == 0" class="van-f-red">*</span>
|
|
|
+ {{ 1 + index + '.' }}
|
|
|
+ {{ item.customName }}
|
|
|
+ </template>
|
|
|
+ </van-cell>
|
|
|
+ <van-field
|
|
|
+ :disabled="!item.allowWriteAgain"
|
|
|
+ v-model="item.answerValue"
|
|
|
+ :formatter="formatter"
|
|
|
+ autosize
|
|
|
+ type="textarea"
|
|
|
+ :placeholder="item.remark"></van-field>
|
|
|
+ </div>
|
|
|
+ <div v-if="item.answerType == 'duox'" class="formLabel z-cell">
|
|
|
+ <van-cell>
|
|
|
+ <template #title>
|
|
|
+ <span v-if="item.isMust == 0" class="van-f-red">*</span>
|
|
|
+ {{ 1 + index + '.' }}
|
|
|
+ {{ item.customName }}
|
|
|
+ </template>
|
|
|
+ </van-cell>
|
|
|
+ <z-checkbox
|
|
|
+ :disabled="!item.allowWriteAgain"
|
|
|
+ :answerType="item.answerType"
|
|
|
+ :checkboxval="item.answerValue"
|
|
|
+ :collectionType="item.customOptionList"
|
|
|
+ :textc="item.customId"
|
|
|
+ :zCheckboxcolumns="item.customOptionList"
|
|
|
+ @zSelectVal="zSelectVal"></z-checkbox>
|
|
|
+ </div>
|
|
|
+ <div v-if="item.answerType == 'dx'" class="formLabel z-cell">
|
|
|
+ <van-cell>
|
|
|
+ <template #title>
|
|
|
+ <span v-if="item.isMust == 0" class="van-f-red">*</span>
|
|
|
+ {{ 1 + index + '.' }}
|
|
|
+ {{ item.customName }}
|
|
|
+ </template>
|
|
|
+ </van-cell>
|
|
|
+ <z-radio
|
|
|
+ :disabled="!item.allowWriteAgain"
|
|
|
+ :answerType="item.answerType"
|
|
|
+ :collectionType="item.collectionType"
|
|
|
+ :radio="item.answerValue"
|
|
|
+ :textc="item.customId"
|
|
|
+ :zRadiocolumns="item.customOptionList"
|
|
|
+ @zSelectVal="zSelectVal"></z-radio>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ </van-form>
|
|
|
+ <van-calendar
|
|
|
+ v-model="showCalendar"
|
|
|
+ @confirm="onConfirm"
|
|
|
+ color="#0057ba"
|
|
|
+ :min-date="minDate"
|
|
|
+ :max-date="maxDate"
|
|
|
+ :show-confirm="false" />
|
|
|
+ </div>
|
|
|
</template>
|
|
|
<script>
|
|
|
+import zRadio from '@/components/zRadio2';
|
|
|
+import zCheckbox from '@/components/zCheckbox2';
|
|
|
export default {
|
|
|
+ components: { zRadio, zCheckbox },
|
|
|
props: {
|
|
|
reportCustomData: {
|
|
|
- type: Object,
|
|
|
- default: {},
|
|
|
+ type: Array,
|
|
|
+ default: () => [],
|
|
|
+ },
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ reportCustomData: {
|
|
|
+ handler(val) {
|
|
|
+ this.fromData = val;
|
|
|
+ },
|
|
|
+ immediate: true,
|
|
|
+ deep: true,
|
|
|
},
|
|
|
},
|
|
|
data() {
|
|
|
- return {};
|
|
|
+ return {
|
|
|
+ fromData: null,
|
|
|
+ dateIndex: '',
|
|
|
+ showCalendar: false,
|
|
|
+ minDate: new Date(2020, 0, 1),
|
|
|
+ maxDate: new Date(2090, 0, 31),
|
|
|
+ };
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ showCalendarClick(item, index) {
|
|
|
+ if (!item.allowWriteAgain) return;
|
|
|
+ this.dateIndex = index;
|
|
|
+ this.showCalendar = true;
|
|
|
+ },
|
|
|
+ onConfirm(date) {
|
|
|
+ this.showCalendar = false;
|
|
|
+ this.fromData[this.dateIndex].answerValue = this.formatDate(date);
|
|
|
+ },
|
|
|
+ numberFn(val, index) {
|
|
|
+ if (this.fromData[index].answerName) {
|
|
|
+ if (!/^[+-]?\d*\.{0,1}\d{0,1}$/.test(this.fromData[index].answerName)) {
|
|
|
+ this.fromData[index].answerName = this.fromData[index].answerName.replace(
|
|
|
+ /\.\d{2,}$/,
|
|
|
+ this.fromData[index].answerName.substr(this.fromData[index].answerName.indexOf('.'), 3)
|
|
|
+ );
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ formatter(value) {
|
|
|
+ return value.replace(
|
|
|
+ /[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF][\u200D|\uFE0F]|[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF]|[0-9|*|#]\uFE0F\u20E3|[0-9|#]\u20E3|[\u203C-\u3299]\uFE0F\u200D|[\u203C-\u3299]\uFE0F|[\u2122-\u2B55]|\u303D|[\A9|\AE]\u3030|\uA9|\uAE|\u3030/gi,
|
|
|
+ ''
|
|
|
+ );
|
|
|
+ },
|
|
|
+ zSelectVal(value) {
|
|
|
+ // console.log(value);
|
|
|
+ // var collectionAnswerlisd = this.collectionAnswerlisd;
|
|
|
+ // if (collectionAnswerlisd.length > 0) {
|
|
|
+ // var num = 0;
|
|
|
+ // for (var a = 0; a < collectionAnswerlisd.length; a++) {
|
|
|
+ // if (collectionAnswerlisd[a].id == value.id) {
|
|
|
+ // collectionAnswerlisd[a] = value;
|
|
|
+ // num = 0;
|
|
|
+ // } else {
|
|
|
+ // num = 1;
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // if (num > 0) {
|
|
|
+ // collectionAnswerlisd.push(value);
|
|
|
+ // }
|
|
|
+ // } else {
|
|
|
+ // collectionAnswerlisd.push(value);
|
|
|
+ // }
|
|
|
+ // this.collectionAnswerlisd = collectionAnswerlisd;
|
|
|
+ },
|
|
|
},
|
|
|
};
|
|
|
</script>
|
