ykt-wxapp/components/form-template/form-cell/index.vue

<template>
  <form-positive-find
    v-if="attrs.title === 'positiveFind'"
    v-bind="attrs"
    :form="form"
    :disableChange="disableChange"
    @change="change"
  />
  <form-diagnosis-picker
    v-else-if="attrs.title === 'diagnosis' || attrs.title === 'diagnosisName'"
    v-bind="attrs"
    :form="form"
    :disableChange="disableChange"
    @change="change"
  />
  <form-surgical-history
    v-else-if="attrs.title === 'surgicalHistory'"
    v-bind="attrs"
    :form="form"
    :disableChange="disableChange"
    @change="change"
  />
  <form-datepicker v-else-if="attrs.type === 'date'" v-bind="attrs" :form="form" :disableChange="disableChange" @change="change" />
  <form-input v-else-if="attrs.type === 'input'" v-bind="attrs" :form="form" :disableChange="disableChange" @change="change" />
  <form-radio v-else-if="attrs.type === 'radio'" v-bind="attrs" :form="form" :disableChange="disableChange" @change="change" />
  <form-region v-else-if="attrs.type === 'region'" v-bind="attrs" :form="form" :disableChange="disableChange" @change="change" />
  <form-select v-else-if="attrs.type === 'select'" v-bind="attrs" :form="form" :disableChange="disableChange" @change="change" />
  <form-select-other v-else-if="attrs.type === 'selectAndOther'" v-bind="attrs" :form="form" :disableChange="disableChange" @change="change" />
  <form-select-image v-else-if="attrs.type === 'selectAndImage'" v-bind="attrs" :form="form" :disableChange="disableChange" @change="change" />
  <form-select-mobile v-else-if="attrs.type === 'selectMobile'" v-bind="attrs" :form="form" :disableChange="disableChange" @change="change" />
  <form-textarea v-else-if="attrs.type === 'textarea'" v-bind="attrs" :form="form" :disableChange="disableChange"
    @change="change" />
  <form-multi-select-and-other
    v-else-if="attrs.type === 'multiSelectAndOther'"
    v-bind="attrs"
    :form="form"
    :disableChange="disableChange"
    @change="change"
  />
  <form-run-time v-else-if="attrs.type === 'runTime'" v-bind="attrs" :form="form" :disableChange="disableChange" @change="change" />
  <form-files v-else-if="attrs.type === 'files'" v-bind="attrs" :form="form" :disableChange="disableChange" @change="change" />
  <view v-else-if="attrs.type || attrs.name || attrs.title" class="py-20rpx px-30rpx border-bottom text-28rpx text-gray-500">
    {{ attrs.name || attrs.title }}（暂不支持：{{ attrs.type }}）
  </view>

  <!-- 
  <form-operation v-else-if="attrs.title === 'surgicalHistory'" v-bind="attrs" :form="form" @change="change"
    @addRule="addRule" />
  <form-mult v-else-if="attrs.type === 'multiSelectAndOther'" v-bind="attrs" :form="form" @change="change"
    @addRule="addRule" />
  <customer-mult-disease v-else-if="attrs.type === 'selfMultipleDiseases'" v-bind="attrs" :form="form"
    @change="change"></customer-mult-disease> -->
  <!-- <view v-else-if="type" class="py-20rpx px-30rpx border-bottom"> {{ type }} {{ attrs.name }}</view> -->
</template>
<script setup>
import { useAttrs } from 'vue';

import formInput from './form-input.vue';
import formSelect from './form-select.vue';
import formRadio from './form-radio.vue';
import formDatepicker from './form-datepicker.vue';
import formRegion from './form-region.vue';
import formTextarea from './form-textarea.vue';
import formMultiSelectAndOther from './form-multiSelectAndOther.vue';
import formSelectOther from './form-select-other.vue';
import formSelectMobile from './form-select-mobile.vue';
import formRunTime from './form-run-time.vue';
import formFiles from './form-files.vue';
import formSelectImage from './form-select-image.vue';
import formSurgicalHistory from './form-surgical-history.vue';
import formPositiveFind from './form-positive-find.vue';
import formDiagnosisPicker from './form-diagnosis-picker.vue';

defineProps({
  form: {
    type: Object,
    default: () => ({})
  },
  disableChange: {
    type: Boolean,
    default: false
  }
})

const attrs = useAttrs();
const emits = defineEmits(['change']);

function change(data) {
  emits('change', data)
}
</script>

<!-- <script>
import formDatepicker from './form-datepicker.vue';
import formInput from './form-input.vue';
import formRadio from './form-radio.vue';
import formSelect from './form-select.vue';
import formRegion from './form-region/form-region.vue';
import formTextarea from './form-textarea.vue';
import formMult from './form-multiSelectAndOther.vue';
import formOperation from './form-operation.vue';
import customerMultDisease from '../custom-cell/custom-multiple-diseases.vue';
export default {
  components: {
    formInput,
    formSelect,
    formDatepicker,
    formRadio,
    formRegion,
    formTextarea,
    formMult,
    formOperation,
    customerMultDisease
  },
  props: {
    form: {
      type: Object,
      default: () => ({})
    }
  },
  computed: {
    componentName() {
      return FormComponent[this.attrs.type]
    }
  },
  methods: {
    change(data) {
      this.$emit('change', data)
    },
    addRule(data) {
      this.$emit('addRule', data)
    }
  }
}
</script> -->

<style lang="scss" scoped></style>