From e734b4078d34fc8e57999cabf531c21b2b62f659 Mon Sep 17 00:00:00 2001
From: "Lyj@210615" <18050528999@163.com>
Date: Tue, 6 Dec 2022 17:33:33 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8F=AA=E8=AF=BB=E8=A1=A8=E5=8D=95=EF=BC=8C?=
 =?UTF-8?q?=E5=AD=98=E6=B4=BB=E9=83=A8=E5=88=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../FormComponents/CustomForm/FormContent.vue |   5 -
 .../CustomForm/FormItemSelf.vue               |  17 +-
 .../FormComponents/ReadForm/FormContent2.vue  | 172 ++++
 .../FormComponents/ReadForm/FormItemSelf2.vue | 794 ++++++++++++++++++
 .../FormComponents/ReadForm/index.vue         | 399 +++++++++
 src/router/index.js                           |  12 +
 src/views/audit-qualitycontrol/hospital.vue   |   2 +-
 src/views/followupentry/followaduit.vue       | 237 ++++++
 src/views/followupentry/index.vue             | 219 ++++-
 .../screening/components/ConfigForms.vue      |  37 +-
 src/views/screening/components/FormTab.vue    | 227 ++++-
 src/views/screening/components/mixin.js       |   1 +
 12 files changed, 2086 insertions(+), 36 deletions(-)
 create mode 100644 src/components/FormComponents/ReadForm/FormContent2.vue
 create mode 100644 src/components/FormComponents/ReadForm/FormItemSelf2.vue
 create mode 100644 src/components/FormComponents/ReadForm/index.vue
 create mode 100644 src/views/followupentry/followaduit.vue

diff --git a/src/components/FormComponents/CustomForm/FormContent.vue b/src/components/FormComponents/CustomForm/FormContent.vue
index 34a0d2c..133a442 100644
--- a/src/components/FormComponents/CustomForm/FormContent.vue
+++ b/src/components/FormComponents/CustomForm/FormContent.vue
@@ -191,11 +191,6 @@ export default {
       }
     },
   },
-  watch: {
-    showIndex(val){
-      console.log("组件内部",val)
-    }
-  },
 }
 </script>
 
diff --git a/src/components/FormComponents/CustomForm/FormItemSelf.vue b/src/components/FormComponents/CustomForm/FormItemSelf.vue
index eedc337..198b3e4 100644
--- a/src/components/FormComponents/CustomForm/FormItemSelf.vue
+++ b/src/components/FormComponents/CustomForm/FormItemSelf.vue
@@ -6,7 +6,10 @@
     :class="{ isDefects: defectsSet.includes(item.prop) }"
   >
     <el-col :lg="item.width">
-      <div v-if="showIndex || configForms.showIndex" class="formIndex">{{ columnIndex + 1 }}</div>
+      <div
+        v-if="showIndex || configForms && configForms.showIndex"
+        class="formIndex"
+      >{{ columnIndex + 1 }}</div>
       <el-form-item
         :label="
           !hiddenLabel && item.label
@@ -27,10 +30,6 @@
               :upload-query="{ formId, patientId, prefix: item.prop }"
               :disabled="item.disabled"
             ></el-upload-self>
-            <!-- 只显示 -->
-            <!-- <template>
-              
-            </template>-->
             <!-- 表单改文本 -->
             <template v-else-if="vwForm.detail">
               <form-item-text :item="item" :form="form"></form-item-text>
@@ -347,9 +346,6 @@
                 align="right"
                 @change="handleChange"
               ></el-date-picker>
-
-              <!-- 文本显示 -->
-              <span>{{form[item.prop]}}</span>
             </template>
           </div>
           <span
@@ -454,11 +450,6 @@ export default {
   },
   mounted() {
     this.showFormItem()
-    console.log("组件内部2",this.configForms.showIndex)
-    // this.configForms.showIndex=this.showIndex
-    this.$nextTick(() => {
-      console.log("组件内部3",this.configForms.showIndex)
-    })
   },
   methods: {
     scrollToView() {
diff --git a/src/components/FormComponents/ReadForm/FormContent2.vue b/src/components/FormComponents/ReadForm/FormContent2.vue
new file mode 100644
index 0000000..01f110f
--- /dev/null
+++ b/src/components/FormComponents/ReadForm/FormContent2.vue
@@ -0,0 +1,172 @@
+<template>
+  <!-- 删除display isShowIm item.importantField item.style-->
+  <el-row :gutter="options.gutter" class="form-content">
+    <template v-for="(item, columnIndex) in columns.column || columns.children.column">
+      <el-col
+        v-if="item.type === 'title'"
+        :key="columnIndex"
+        class="row12"
+        :xs="item.xs || 24"
+        :sm="item.sm || 24"
+        :md="item.md || 24"
+        :lg="item.span || 12"
+      >
+        <div class="form_title">
+          <span>{{ item.value }}</span>
+        </div>
+      </el-col>
+
+      <el-col
+        v-else
+        :key="columnIndex"
+        class="row24"
+        :xs="item.xs || 24"
+        :sm="item.sm || 24"
+        :md="item.md || 24"
+        :lg="item.lg || item.span || 12"
+        :xl="item.span || 12"
+      >
+        <form-item-self
+          :form="form"
+          :column-index="columnIndex"
+          :item="item"
+          :columns="columns.column || columns.children.column"
+          :group="options.group"
+          @formChange="formChange"
+        ></form-item-self>
+      </el-col>
+    </template>
+  </el-row>
+</template>
+
+<script>
+/**
+ * @description 自定义表单
+ */
+import FormItemSelf from "./FormItemSelf2.vue"
+
+export default {
+  name: "FormContent",
+  components: { FormItemSelf },
+
+  props: {
+    form: {
+      type: Object,
+      default: () => {
+        return {}
+      },
+    },
+    options: {
+      type: Object,
+      default: () => {
+        return {}
+      },
+    }, //配置 数据
+    columns: Object, //表单数据
+    size: { type: String, default: "small" },
+    formStyle: Object,
+    formEdit: {
+      type: Object,
+      default: () => {
+        return {}
+      },
+    },
+    isShowImportant: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data() {
+    return {}
+  },
+
+  computed: {
+    isShowIm() {
+      return function (val) {
+        return !this.isShowImportant ? true : val
+      }
+    },
+    paddingLeft() {
+      const columns = this.columns
+      return columns.labelWidth ? `${columns.labelWidth}px` : ""
+    },
+  },
+  methods: {
+    handleChange(key, val) {
+      if (this.form.hasOwnProperty(key)) this.form[key] = val
+    },
+    // 切换不符合筛查条件的显示
+    formChange() {
+      console.log(this.form)
+      let arr = [
+        "is_one_year",
+        "is_subtotal_history",
+        "is_ppi",
+        "is_symptom",
+        "is_subtotal_history",
+        "is_disease",
+        "is_tumour",
+      ]
+      let flag = 0
+      for (let i = 0; i < arr.length; i++) {
+        if (this.form[arr[i]] && this.form[arr[i]] == 0) {
+          flag++
+        }
+      }
+      if (flag == 0) {
+        this.$emit("showError", false)
+      } else {
+        this.$emit("showError", true)
+      }
+    },
+  },
+  watch: {
+  },
+  mounted(){
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+::v-deep {
+  .row24.el-col-lg-12 {
+    &:nth-child(2n) {
+      border-left: 1px solid #ccc;
+    }
+  }
+}
+.form-content ::v-deep {
+  display: flex;
+  flex-wrap: wrap;
+  .el-form-item {
+    display: flex;
+    align-items: center;
+    .el-form-item__label {
+      line-height: 1.2;
+    }
+    .el-form-item__content {
+      margin-left: 0 !important;
+      flex: 1;
+      display: flex;
+      align-items: center;
+    }
+  }
+}
+
+.form_title {
+  background-color: #fff;
+  padding: 10px 0px;
+  margin: 3px;
+  span {
+    height: 33px;
+    line-height: 33px;
+  }
+}
+.dynamic-form-container {
+  &_lable {
+    font-weight: bold;
+    font-size: 16px;
+    line-height: 40px;
+  }
+}
+</style>
diff --git a/src/components/FormComponents/ReadForm/FormItemSelf2.vue b/src/components/FormComponents/ReadForm/FormItemSelf2.vue
new file mode 100644
index 0000000..7fe0fec
--- /dev/null
+++ b/src/components/FormComponents/ReadForm/FormItemSelf2.vue
@@ -0,0 +1,794 @@
+<template>
+  <el-row
+    :ref="item.prop"
+    class="custom-form-item"
+    :style="item.styles"
+    :class="{ isDefects: defectsSet.includes(item.prop) }"
+  >
+    <el-col :lg="item.width">
+      <div
+        v-if="showIndex || configForms && configForms.showIndex"
+        class="formIndex"
+      >{{ columnIndex + 1 }}</div>
+      <el-form-item
+        :label="
+          !hiddenLabel && item.label
+            ? `${item.label}${item.labelSuffix || ''}`
+            : ''
+        "
+        :label-width="item.labelWidth ? `${item.labelWidth}px` : ''"
+        :prop="item.prop"
+        :rules="item.rules"
+        :class="isEmpty"
+      >
+        <div class="flex">
+          <div>
+            <!-- <el-upload-self
+              v-if="item.type === 'upload'"
+              v-model="form[item.prop]"
+              v-bind="item"
+              :upload-query="{ formId, patientId, prefix: item.prop }"
+              :disabled="item.disabled"
+            ></el-upload-self>-->
+            <!-- 只显示 -->
+            <template>
+              <!-- 有选项 -->
+              <!-- item.type == 'radio'||item.type === 'checkbox'||item.type === 'select'||item.type === 'cascader' -->
+              <span v-if="item.dicData">
+                <span
+                  v-for="(opt, optIndex) in item.dicData"
+                  :key="optIndex"
+                  v-show="form[item.prop]==opt.value"
+                >{{ opt.label }}</span>
+              </span>
+              <span v-else>{{form[item.prop]}}</span>
+              <!-- 输入框 -->
+              <!-- <el-input
+                v-if="item.type === 'input'"
+                v-model="form[item.prop]"
+                :class="item.toothBit ? 'toothBit' : ''"
+                :readonly="item.readonly"
+                :disabled="item.disabled"
+                :placeholder="
+                  item.placeholder ||
+                  ` ${item.label ? '请输入' + item.label : ''}`
+                "
+                :clearable="item.notClearable ? false : true"
+                :maxlength="
+                  item.maxlength
+                    ? item.maxlength
+                    : item.fieldType === 'text'
+                    ? ''
+                    : item.fieldLength
+                "
+                @blur="handleBlur"
+              ></el-input>-->
+
+              <!-- 文本域 -->
+              <!-- <template v-if="item.type === 'textarea'">
+                <el-input
+                  v-model="form[item.prop]"
+                  type="textarea"
+                  :placeholder="
+                    item.placeholder || `请输入 ${item.label || ''}`
+                  "
+                  :autosize="{ minRows: item.minRows, maxRows: item.maxRows }"
+                  :minlength="item.minlength"
+                  :disabled="item.disabled"
+                  :maxlength="
+                    item.maxlength
+                      ? item.maxlength
+                      : item.fieldType === 'text'
+                      ? ''
+                      : item.fieldLength
+                  "
+                  :show-word-limit="item.showWordLimit"
+                  @blur="handleBlur"
+                ></el-input>
+              </template>-->
+
+              <!-- 计数器 -->
+              <!-- <div v-if="item.type === 'number'" style="display: inline-table">
+                <el-input-number
+                  v-model="form[item.prop]"
+                  :readonly="item.readonly"
+                  :disabled="item.disabled"
+                  :controls="item.controls ? true : false"
+                  :controls-position="item.controlsPosition"
+                  :placeholder="item.placeholder"
+                  :step="item.step"
+                  :precision="item.precision"
+                  :min="item.minRows"
+                  :max="item.maxRows"
+                  style="display: table-cell"
+                  @blur="handleBlur"
+                ></el-input-number>
+                <span
+                  v-if="item.append"
+                  class="el-input-group__append"
+                  style="line-height: 28px"
+                >{{ item.append }}</span>
+              </div>-->
+
+              <!-- 单选框 -->
+              <!-- <el-radio-group
+                v-if="item.type === 'radio'"
+                v-model="form[item.prop]"
+                :disabled="item.disabled"
+                @change="handleChange"
+              >
+                <el-radio
+                  v-for="(opt, optIndex) in item.dicData"
+                  :key="optIndex"
+                  :label="opt.value"
+                >{{ opt.label }}</el-radio>
+              </el-radio-group>-->
+
+              <!-- 多选框 -->
+              <!-- <template v-if="item.type === 'checkbox'">
+                <el-checkbox-group
+                  v-model="form[item.prop]"
+                  :disabled="item.disabled"
+                  @change="handleChange"
+                >
+                  <el-checkbox
+                    v-for="(opt, optIndex) in item.dicData"
+                    :key="optIndex"
+                    :label="opt.value"
+                  >{{ opt.label }}</el-checkbox>
+                </el-checkbox-group>
+              </template>-->
+
+              <!-- 下拉框 -->
+              <!-- <template v-if="item.type === 'select'">
+                <el-select
+                  v-model="form[item.prop]"
+                  :clearable="item.clearable"
+                  :filterable="item.filterable"
+                  :disabled="item.disabled"
+                  :placeholder="
+                    item.placeholder
+                      ? item.placeholder
+                      : `请选择 ${item.label || ''}`
+                  "
+                  default-first-option
+                  :multiple="item.multiple"
+                  :multiple-limit="item.limit"
+                  @change="handleChange"
+                >
+                  <el-option
+                    v-for="(opt, optIndex) in item.dicData"
+                    :key="optIndex"
+                    :label="opt.label"
+                    :value="opt.value"
+                  ></el-option>
+                </el-select>
+              </template>-->
+              <!-- 级联 -->
+              <!-- <el-cascader
+                v-else-if="item.type === 'cascader'"
+                v-model="form[item.prop]"
+                :disabled="item.disabled"
+                clearable
+                :filterable="item.filterable"
+                :props="{ multiple: item.multiple }"
+                :options="item.dicData"
+                :show-all-levels="item.showAllLevels"
+                :separator="item.separator"
+                style="width: 100%"
+                @change="handleChange"
+              ></el-cascader>-->
+
+              <!-- 时间 -->
+              <!-- <el-time-picker
+                v-else-if="item.type === 'time'"
+                v-model="form[item.prop]"
+                :placeholder="item.placeholder ? item.placeholder : '请选择'"
+                :value-format="item.valueFormat"
+                :format="item.format"
+                :disabled="item.disabled"
+                style="width: 100%"
+                clearable
+                @change="handleChange"
+              ></el-time-picker>-->
+              <!-- 时间范围 -->
+              <!-- <el-time-picker
+                v-else-if="item.type === 'timerange'"
+                v-model="form[item.prop]"
+                is-range
+                range-separator="至"
+                :start-placeholder="item.startPlaceholder"
+                :end-placeholder="item.endPlaceholder"
+                :unlink-panels="item.unlinkPanels"
+                :value-format="item.valueFormat"
+                :format="item.format"
+                :disabled="item.disabled"
+                clearable
+                @change="handleChange"
+              ></el-time-picker>-->
+              <!-- 日期 -->
+              <!-- <el-date-picker
+                v-else-if="item.type === 'date'"
+                v-model="form[item.prop]"
+                :placeholder="item.placeholder ? item.placeholder : '请选择'"
+                :value-format="item.valueFormat"
+                :format="item.format"
+                :disabled="item.disabled"
+                clearable
+                @change="handleChange"
+              ></el-date-picker>-->
+              <!-- 年 -->
+              <!-- <el-date-picker
+                v-else-if="item.type === 'year'"
+                v-model="form[item.prop]"
+                type="year"
+                :placeholder="item.placeholder ? item.placeholder : '请选择'"
+                :value-format="item.valueFormat"
+                :format="item.format"
+                :disabled="item.disabled"
+                clearable
+                @change="handleChange"
+              ></el-date-picker>-->
+              <!-- 月 -->
+
+              <!-- <el-date-picker
+                v-else-if="item.type === 'month'"
+                v-model="form[item.prop]"
+                type="month"
+                :placeholder="item.placeholder ? item.placeholder : '请选择'"
+                :value-format="item.valueFormat"
+                :format="item.format"
+                :disabled="item.disabled"
+                clearable
+                @change="handleChange"
+              ></el-date-picker>-->
+              <!-- 周 -->
+
+              <!-- <el-date-picker
+                v-else-if="item.type === 'week'"
+                v-model="form[item.prop]"
+                type="week"
+                :placeholder="item.placeholder ? item.placeholder : '请选择'"
+                :value-format="item.valueFormat || 'yyyy-ww'"
+                :format="item.format || 'yyyy 第 WW 周'"
+                :disabled="item.disabled"
+                clearable
+                @change="handleChange"
+              ></el-date-picker>-->
+              <!-- 日期范围 -->
+
+              <!-- <el-date-picker
+                v-else-if="item.type === 'daterange'"
+                v-model="form[item.prop]"
+                type="daterange"
+                range-separator="至"
+                :start-placeholder="item.startPlaceholder"
+                :end-placeholder="item.endPlaceholder"
+                :unlink-panels="item.unlinkPanels"
+                :value-format="item.valueFormat"
+                :format="item.format"
+                :disabled="item.disabled"
+                clearable
+                @change="handleChange"
+              ></el-date-picker>-->
+
+              <!-- 日期时间 -->
+              <!-- <el-date-picker
+                v-else-if="item.type === 'datetime'"
+                v-model="form[item.prop]"
+                type="datetime"
+                :placeholder="item.placeholder ? item.placeholder : '请选择'"
+                clearable
+                :disabled="item.disabled"
+                :picker-options="pickerOptions"
+                :value-format="item.valueFormat"
+                :format="item.format"
+                @change="handleChange"
+              ></el-date-picker>-->
+
+              <!-- 日期时间范围 -->
+              <!-- <el-date-picker
+                v-else-if="item.type === 'datetimerange'"
+                v-model="form[item.prop]"
+                type="datetimerange"
+                :picker-options="rangeOptions"
+                range-separator="至"
+                clearable
+                :disabled="item.disabled"
+                :start-placeholder="item.startPlaceholder"
+                :end-placeholder="item.endPlaceholder"
+                :value-format="item.valueFormat"
+                :format="item.format"
+                align="right"
+                @change="handleChange"
+              ></el-date-picker>-->
+            </template>
+          </div>
+          <span
+            v-if="item.importantField && !vwForm.detail"
+            class="important_field"
+          >{{ item.importantFieldDesc || "*" }}</span>
+        </div>
+      </el-form-item>
+    </el-col>
+    <dialog-tooth-bit
+      v-if="item.toothBit"
+      ref="dialog"
+      v-model="form[item.prop]"
+      append-to-body
+      title="牙位选择"
+    ></dialog-tooth-bit>
+  </el-row>
+</template>
+
+<script>
+/**
+ * @description 自定义单组件
+ */
+
+import ElUploadSelf from "@/components/Upload"
+import { getTimePoor, getInfoByIdCard } from "@/utils/index"
+import { getChineseHeadLetter } from "@/utils/chinesePingyin.js"
+import { pickerOptions, rangeOptions } from "@/data/dateOption"
+export default {
+  name: "FormItemSelf",
+  components: { ElUploadSelf },
+  inject: {
+    showIndex: {
+      default: false,
+    },
+    vwForm: {
+      default: {},
+    },
+    // formId: {},
+    getPatientId: {
+      type: Function,
+      default: () => {},
+    },
+    getDefectsSet: {
+      type: Function,
+      default: () => {},
+    },
+    configForms: {
+      type: Function,
+      default: () => {},
+    },
+  },
+  props: {
+    item: {
+      type: Object,
+    },
+    form: {
+      type: Object | Array,
+    },
+    hiddenLabel: {
+      type: Boolean,
+      default: false,
+    },
+    columns: Array,
+    columnIndex: Number,
+    group: Array,
+    type: String,
+  },
+  data() {
+    return {
+      pickerOptions,
+      rangeOptions,
+    }
+  },
+  computed: {
+    //重要字段空数据且填写表单时添加重点
+    isEmpty() {
+      const { importantField, prop } = this.item
+      if (!importantField || this.vwForm.detail) return ""
+
+      const value = this.form[prop] // []
+      let empty = !value
+      if (value === 0) empty = false
+      else if (value && typeof value !== "number") {
+        empty = !(Object.keys(value) || value).length
+      }
+      return empty ? "empty-tip" : ""
+    },
+    defectsSet() {
+      return this.getDefectsSet ? this.getDefectsSet() : []
+    },
+    patientId() {
+      return this.getPatientId ? this.getPatientId() : ""
+    },
+  },
+  created() {
+    this.timerangeReset()
+    this.numberReset()
+    this.checkboxReset()
+  },
+  mounted() {
+    this.showFormItem()
+  },
+  methods: {
+    scrollToView() {
+      if (this.$refs["JY_LCYY"]) {
+        this.$refs["JY_LCYY"].$el.scrollIntoView({ behavior: "smooth" })
+      }
+    },
+    openToothBit() {
+      this.$refs.dialog.open()
+    },
+
+    // 处理timerange 重置后不能选择的问题
+    timerangeReset() {
+      if (this.item.type === "timerange") {
+        this.$watch(`form.${this.item.prop}`, (val) => {
+          if (val && val.length === 1) {
+            this.form[this.item.prop] = null
+          }
+        })
+      }
+    },
+    // 处理number 默认为0的问题
+    numberReset() {
+      if (this.item.type === "number") {
+        this.$watch(
+          `form.${this.item.prop}`,
+          (val) => {
+            if (!val && val !== 0 && val !== undefined) {
+              this.form[this.item.prop] = undefined
+            }
+          },
+          { immediate: true }
+        )
+      }
+    },
+
+    // 处理数组 默认值的问题
+    checkboxReset() {
+      const { type, multiple, value } = this.item
+      if (
+        type === "checkbox" ||
+        (type === "select" && multiple) ||
+        type === "cascader"
+      ) {
+        if (value && typeof value === "string") {
+          this.form[this.item.prop] = value.split(",")
+        }
+        this.$watch(
+          `form.${this.item.prop}`,
+          (val) => {
+            if (!Array.isArray(val)) {
+              this.$set(this.form, this.item.prop, [])
+            }
+          },
+          { immediate: true }
+        )
+      }
+    },
+
+    // 处理复选框排斥
+    checkboxRepel(val) {
+      const { repelValue, repel } = this.item
+      if (repel && repelValue) {
+        const len = val.length
+        const lastValue = val[len - 1]
+        if (!lastValue) return
+        if (lastValue === repelValue) {
+          this.form[this.item.prop].splice(0, len - 1)
+        } else {
+          let idx = val.findIndex((_) => _ === repelValue)
+          if (idx > -1) {
+            this.form[this.item.prop].splice(idx, 1)
+          }
+        }
+      }
+    },
+    // 处理运算规则
+    handleAlgorithm() {
+      const { algorithm } = this.item
+      if (algorithm) {
+        const algorithmArr = algorithm.split(";") //多个规则数组集合
+        algorithmArr.forEach((item) => {
+          if (item.includes("|")) {
+            // 自定义方法规则： type|target|args
+            const algorithmValue = item.split("|")
+            this.handleSelfProcess(algorithmValue)
+          } else {
+            // 直接运算 target=process
+            let target = this.getProp(algorithm.split("=")[0])
+            if (!this.form.hasOwnProperty(target)) return
+            let process = this.getProcess(algorithm.split("=")[1])
+            if (process.includes("stop")) return
+            try {
+              this.$set(this.form, target, eval(process))
+            } catch {}
+          }
+        })
+      } else {
+        // let { birthday } = this.form
+        // if (birthday) {
+        //   birthday = new Date(birthday.replace(/-/g, "/"))
+        //   let d = new Date()
+        //   let age =
+        //     d.getFullYear() -
+        //     birthday.getFullYear() -
+        //     (d.getMonth() < birthday.getMonth() ||
+        //     (d.getMonth() == birthday.getMonth() &&
+        //       d.getDate() < birthday.getDate())
+        //       ? 1
+        //       : 0)
+        //   console.log(age)
+        //   if (age == 0) {
+        //   }
+        // }
+      }
+    },
+    // 自定义方法规则
+    handleSelfProcess(algorithmValue) {
+      const type = algorithmValue[0]
+      const ruleTarget = algorithmValue[1]
+      const ruleArgs = algorithmValue[2]
+      if (!ruleTarget || !ruleArgs || !this.form.hasOwnProperty(ruleTarget))
+        return
+      const args = ruleArgs.split(",").map((v) => {
+        if (v) {
+          return this.form[v]
+        }
+        return null
+      })
+
+      let val
+      switch (type) {
+        // 时间差
+        case "timepoor":
+          val = getTimePoor(...args)
+          break
+        case "initials":
+          //计算中文姓名缩写
+          val = getChineseHeadLetter(...args)
+          break
+        case "idcard_birthdate":
+          val = getInfoByIdCard(...args)
+          break
+        case "idcard_age":
+          val = getInfoByIdCard(...args, "age")
+          break
+        case "idcard_gender":
+          val = getInfoByIdCard(...args, "gender")
+          break
+        default:
+          break
+      }
+      val && this.$set(this.form, ruleTarget, val)
+    },
+    // 获取prop  prop 以{}包裹
+    getProp(value) {
+      if (!value) return ""
+      return value.replace(/[{][\w]*[}]/g, (word) => {
+        return word.replace(/{|}/g, "")
+      })
+    },
+    // 获取运算过程
+    getProcess(value) {
+      return value.replace(/[{][\w]*[}]/g, (word) => {
+        const actualValue = this.form[word.replace(/{|}/g, "")]
+        return actualValue ? actualValue : "stop"
+      })
+    },
+    // 表单子项控制显隐
+    showFormItem() {
+      const { dynamicshSet, prop, noImmediate } = this.item
+      if (dynamicshSet && dynamicshSet.length > 0) {
+        this.$watch(
+          `form.${prop}`,
+          function (val) {
+            const columns = this.columns || []
+            const group = this.group || []
+            const dyMap = {} // 显示数据集合
+            dynamicshSet.forEach((dy) => {
+              if (dyMap[dy.target]) {
+                dyMap[dy.target].push(dy.value)
+              } else {
+                dyMap[dy.target] = [dy.value]
+              }
+            })
+
+            Object.keys(dyMap).forEach((key) => {
+              let targetItem = columns.find((_) => _.prop === key)
+              if (!targetItem) {
+                targetItem = group.find((_) => _.prop === key)
+              }
+              if (!targetItem) return
+              const values = dyMap[key]
+              let display = false
+              if (Array.isArray(val)) {
+                display = values.filter((v) => val.includes(v)).length > 0
+              } else {
+                display = values.includes(val)
+              }
+
+              if (!display && targetItem) {
+                // 清空数据
+                const newVal = Array.isArray(this.form[targetItem.prop])
+                  ? []
+                  : targetItem.type === "number"
+                  ? undefined
+                  : ""
+                this.$set(this.form, targetItem.prop, newVal)
+              }
+
+              if (this.type === "form") {
+                // 动态表格、表单处理
+                setTimeout(() => {
+                  this.$set(this.form, "$_hidden" + targetItem.prop, !display)
+                }, 200)
+              } else {
+                this.$set(targetItem, "display", Boolean(display))
+              }
+            })
+          },
+          {
+            immediate: !noImmediate,
+          }
+        )
+      }
+    },
+    //
+    handleBlur() {
+      this.handleAlgorithm()
+    },
+    handleChange(val) {
+      this.checkboxRepel(val)
+      this.handleAlgorithm()
+      // 该操作判断是否符合筛查条件
+      this.$emit("formChange")
+      // ['is_one_year','is_subtotal_history','is_ppi','is_symptom','is_subtotal_history','is_disease','is_tumour']
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.custom-form-item {
+  background: white;
+  border-bottom: 1px solid #ccc;
+  // margin: 3px;
+
+  .el-col {
+    height: 100%;
+    height: 53px;
+    display: flex;
+    align-items: center;
+  }
+  .formIndex {
+    min-width: 53px;
+    height: 100%;
+    background: #fafafa;
+    border-right: 1px solid #ccc;
+    justify-content: center;
+    display: flex;
+    align-items: center;
+    // margin-right: 20px;
+  }
+  &.isDefects {
+    border: 1px solid red;
+  }
+  ::v-deep .el-form-item {
+    padding: 10px 0 10px 20px;
+    margin-bottom: 0px;
+  }
+  .toothBit {
+    ::v-deep .el-input-group__append {
+      background-color: #1890ff;
+      border-color: #1890ff;
+      color: #fff;
+    }
+  }
+  .el-input,
+  .el-select,
+  .el-cascader,
+  .el-date-editor {
+    width: 100%;
+  }
+  .el-input-number {
+    width: 100%;
+  }
+  .flex {
+    align-items: center;
+    > div {
+      flex: 1;
+    }
+  }
+  .inline-block {
+    > div {
+      display: inline-block;
+    }
+  }
+  .important_field {
+    color: #ff4d4f;
+    padding-left: 10px;
+    display: inline-block;
+    max-width: 150px;
+    line-height: 1.2;
+  }
+
+  ::v-deep .el-input-number .el-input__inner {
+    padding: 0 2px !important;
+  }
+
+  .el-radio {
+    padding: 2px 0;
+  }
+
+  // 去除禁用样式
+  ::v-deep .is-disabled {
+    input {
+      background-color: #fff;
+      color: #606266;
+    }
+
+    .el-textarea__inner,
+    .el-input__inner {
+      background-color: #fff;
+      color: #606266;
+    }
+    .el-checkbox__inner,
+    .el-radio__inner {
+      background-color: #fff;
+    }
+    + span.el-checkbox__label,
+    + span.el-radio__label {
+      color: #606266;
+    }
+    &.is-checked {
+      .el-radio__inner {
+        border-color: #1890ff;
+        background: #1890ff;
+        &::after {
+          background: #fff;
+        }
+      }
+      + .el-radio__label {
+        color: #1890ff;
+      }
+
+      .el-checkbox__inner {
+        background-color: #1890ff;
+        border-color: #1890ff;
+        &::after {
+          border-color: #fff;
+        }
+      }
+    }
+  }
+
+  .empty-tip {
+    ::v-deep .el-form-item__label {
+      color: #333333;
+    }
+  }
+
+  ::v-deep .el-form-item__label {
+    font-weight: bolder;
+  }
+  // ::v-deep .el-form-item__label::after {
+  //   content: "☑";
+  //   color: #ff4d4f;
+  //   margin-left: 4px;
+  // }
+
+  ::v-deep .el-checkbox-group {
+    &::after,
+    &::before {
+      content: " ";
+      display: table;
+    }
+    &::after {
+      clear: both;
+      visibility: hidden;
+      font-size: 0;
+      height: 0;
+    }
+    .el-checkbox {
+      float: left;
+    }
+  }
+}
+</style>
diff --git a/src/components/FormComponents/ReadForm/index.vue b/src/components/FormComponents/ReadForm/index.vue
new file mode 100644
index 0000000..5cb1e9d
--- /dev/null
+++ b/src/components/FormComponents/ReadForm/index.vue
@@ -0,0 +1,399 @@
+<template>
+  <el-form
+    ref="form"
+    :model="form"
+    inline-message
+    :disabled="options.disabled"
+    :label-position="options.labelPosition || 'left'"
+    :label-width="(options.labelWidth || 100) + 'px'"
+    :size="size"
+    :style="formStyle"
+    class="avue-form-self"
+    @submit.native.prevent="handleConfirm()"
+  >
+    <template v-if="options.column && options.column.length > 0">
+      <form-content
+        ref="form-content"
+        :form="form"
+        :columns="{ column: options.column }"
+        :options="options"
+        :is-show-important="isShowImportant"
+      ></form-content>
+    </template>
+    <template v-if="options.group && options.group.length > 0">
+      <!-- <el-tabs v-if="options.tabs" v-model="activeName" type="card">
+        <el-tab-pane
+          v-for="(g, gIndex) in options.group"
+          :key="gIndex"
+          :label="g.label || `标签${gIndex + 1}`"
+          :name="`${gIndex}`"
+        >
+          <form-content
+            ref="form-content"
+            :form="form"
+            :columns="g"
+            :options="options"
+            :is-show-important="isShowImportant"
+          ></form-content>
+        </el-tab-pane>
+      </el-tabs>-->
+      <!-- 表单的折叠组件 -->
+      <el-collapse v-model="collapseNames">
+        <template v-for="(g, gIndex) in options.group">
+          <el-collapse-item
+            v-show="g.display"
+            :key="gIndex"
+            :name="g.prop"
+            :disabled="!g.arrow"
+            :class="g.prop == '1669858313508_15760' ? 'otherItemClass' : ''"
+          >
+            <template slot="title">
+              {{ g.label }}
+              <span v-if="g.label == '二、排除标准'" class="noCol">{{errorText}}</span>
+            </template>
+            <form-content
+              v-if="collapseNames.includes(g.prop)"
+              ref="form-content"
+              :form="form"
+              :columns="g"
+              :options="options"
+              :is-show-important="isShowImportant"
+              @showError="showError"
+            ></form-content>
+          </el-collapse-item>
+        </template>
+      </el-collapse>
+    </template>
+    <!-- <div class="form-footer">
+      <template v-if="options.menuBtn">
+        <template v-if="options.submitBtn">
+          <el-button
+            type="primary"
+            :icon="options.submitText == '提交' ? 'el-icon-check' : ''"
+            :loading="loading"
+            size="large"
+            :disabled="disabled"
+            @click="handleConfirm"
+          >{{ options.submitText || "提交" }}</el-button>
+        </template>
+        <template v-if="options.emptyBtn">
+          <el-button
+            plain
+            icon="el-icon-delete "
+            size="large"
+            @click="resetForm(true)"
+          >{{ options.emptyText || "清空" }}</el-button>
+        </template>
+      </template>
+      <template v-if="nextTabBtnShow">
+        <el-form style="display: inline-block; margin-left: 10px">
+          <el-button
+            plain
+            icon="el-icon-caret-right"
+            size="large"
+            @click="nextTab"
+          >{{ options.nextTabText || "下一页" }}</el-button>
+        </el-form>
+      </template>
+    </div>-->
+  </el-form>
+</template>
+
+<script>
+/**
+ * @description 自定义表单
+ */
+import FormContent from "./FormContent2"
+import { isObject } from "@/utils/validate"
+export default {
+  name: "CustomForm",
+  components: { FormContent },
+  props: {
+    options: {
+      //配置 数据
+      type: Object,
+      default: () => {
+        return {}
+      },
+    },
+    size: { type: String, default: "small" },
+    formStyle: { type: Object },
+    formEdit: {
+      type: Object,
+      default: () => {
+        return {}
+      },
+    },
+  },
+  provide() {
+    const vwForm = {}
+    for (const k in this.options) {
+      if (k !== "column" && k !== "group") {
+        vwForm[k] = this.options[k]
+      }
+    }
+
+    return {
+      vwForm,
+    }
+  },
+  data() {
+    return {
+      collapseNames: [],
+      activeName: "0",
+      loading: false,
+      isShowImportant: false,
+      form: {},
+      errorText: "",
+      disabled: false,
+    }
+  },
+  computed: {
+    nextTabBtnShow() {
+      const { nextTabBtn, tabs, group } = this.options
+      return tabs && group && group.length > 1 && nextTabBtn
+    },
+  },
+  watch: {
+    formEdit: {
+      handler() {
+        this.initfields(this.formEdit)
+      },
+    },
+  },
+  created() {
+    this.initforms()
+    this.$nextTick(() => {
+      // this.setformWatch(this.options, "form")
+    })
+  },
+
+  methods: {
+    // 显示不符合筛查条件
+    showError(data) {
+      if (data) {
+        this.disabled = true
+        this.errorText = "不符合筛查条件"
+      } else {
+        this.disabled = false
+        this.errorText = ""
+      }
+    },
+    nextTab() {
+      const tabsLen = this.options.group.length
+      let active = Number(this.activeName)
+      let next = ++active
+      if (next >= tabsLen) next = 0
+      this.activeName = String(next)
+      this.$emit("scrollTop")
+    },
+
+    imFieldChange(val = false) {
+      this.isShowImportant = val
+    },
+    // 查询
+    submit() {
+      this.$emit("submit", this.form)
+    },
+
+    // 重置
+    resetForm(flag) {
+      if (flag) {
+        this.$confirm("是否清空数据?", "提示", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        })
+          .then(() => {
+            this.$message({
+              type: "success",
+              message: "清空成功!",
+            })
+            this.$refs.form.resetFields()
+          })
+          .catch(() => {})
+      } else {
+        if (this.$refs.form) this.$refs.form.resetFields()
+      }
+    },
+
+    validate(func) {
+      this.$refs.form.validate((valid) => {
+        func(valid, () => {})
+      })
+    },
+
+    handleConfirm() {
+      this.loading = true
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          const data = {}
+          const form = this.deepClone(this.form)
+          Object.keys(form).forEach((k) => {
+            if (form[k] === undefined) {
+              data[k] = ""
+              return false
+            }
+            if (k === "YZZKJC") {
+              // 牙周表格
+              data[k] = JSON.stringify(form[k])
+            } else if (
+              Array.isArray(form[k]) &&
+              form[k][0] &&
+              isObject(form[k][0])
+            ) {
+              // 子表单 去除前端添加的显隐辅助数据（$_）和 删除按钮辅助数据（showDelBtn）
+              data[k] = form[k].map((item) => {
+                for (let key in item) {
+                  if (["$_keyField", "$_hidden", "showDelBtn"].includes(key))
+                    delete item[key]
+                }
+                return item
+              })
+            } else {
+              data[k] = form[k]
+            }
+          })
+          this.$emit("handleConfirm", data, () => {
+            this.loading = false
+          })
+        } else {
+          this.loading = false
+        }
+      })
+    },
+
+    // 表单赋值
+    initforms() {
+      const form = {}
+      const collapseNames = []
+      const initFunc = (column = []) => {
+        if (column.length > 0) {
+          column.forEach((item) => {
+            if (!item.prop) return false
+
+            if (
+              item.type === "dynamic" ||
+              item.type === "checkbox" ||
+              item.type === "cascader" ||
+              item.type === "upload" ||
+              (item.type === "select" && item.multiple)
+            ) {
+              form[item.prop] = []
+            } else if (
+              item.type === "dental-tab" ||
+              item.type === "dental-tab-tj"
+            ) {
+              form[item.prop] = {}
+            } else if (item.type === "group") {
+              initFunc(item.children.column)
+            } else if (item.type !== "title") {
+              form[item.prop] = item.value ? item.value : ""
+            }
+          })
+        }
+      }
+      const { group, column } = this.options
+      initFunc(column)
+      group &&
+        group.forEach((g) => {
+          if (g.collapse) {
+            collapseNames.push(g.prop)
+          }
+          initFunc(g.column)
+        })
+      this.collapseNames = collapseNames
+      this.form = form
+      this.loading = false
+      this.$nextTick(() => {
+        // 子组件数据初始化完成后
+        setTimeout(() => {
+          this.initfields(this.formEdit)
+        }, 0)
+        if (this.$refs.form && this.$refs.form.clearValidate) {
+          this.$refs.form.clearValidate()
+        }
+      })
+    },
+    // 绑定部分值(此时表单已渲染)
+    initfields(obj) {
+      for (let k in obj) {
+        if (this.form.hasOwnProperty(k)) {
+          this.form[k] = obj[k]
+        }
+      }
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.avue-form-self {
+  padding: 0 11px;
+  ::v-deep .el-collapse {
+    border: none;
+    .el-collapse-item {
+      &:nth-child(1) {
+        border-top: 1px solid #e5e5e5;
+      }
+    }
+    .el-collapse-item__content {
+      padding-bottom: 0px;
+    }
+    .el-collapse-item__header {
+      background: #fafafa;
+      padding-left: 20px;
+      border: 1px solid #e5e5e5;
+      border-bottom-color: #ccc;
+      border-top: 0px;
+      font-size: 14px;
+      font-family: AlibabaPuHuiTiM;
+      color: #333333;
+    }
+    .el-collapse-item__wrap {
+      border: none;
+      padding: 10px;
+      border-left: 1px solid #e5e5e5;
+      border-right: 1px solid #e5e5e5;
+      // border-bottom: 1px solid #e5e5e5 !important;
+      padding: 0px;
+      &:hover {
+        // background-color: #ecf8ff;
+        // outline: 1px dashed #ccc;
+      }
+    }
+    .el-collapse-item__header {
+      font-size: 16px;
+      font-weight: 600;
+      color: rgba(0, 0, 0, 0.85);
+      height: 50px;
+      line-height: 50px;
+    }
+  }
+  .form-footer {
+    margin-top: 20px;
+    text-align: center;
+  }
+}
+::v-deep .el-col {
+}
+::v-deep .el-radio__input.is-disabled .el-radio__inner {
+  // background-color: $base-color-default;
+  // border-color: $base-color-default;
+}
+.noCol {
+  font-size: 12px;
+  font-family: AlibabaPuHuiTiR;
+  color: #ff4d4f;
+}
+.otherItemClass {
+  ::v-deep {
+    .row24:not(:last-child) {
+      border-left: 0px;
+    }
+    .row24:last-child {
+      border-left: 1px solid #cccccc;
+    }
+  }
+}
+</style>
diff --git a/src/router/index.js b/src/router/index.js
index 25a4326..fcba141 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -52,6 +52,18 @@ export const constantRoutes = [
       },
     ],
   },
+  {
+    path: "/followaduit",
+    component: Layout,
+    children: [
+      {
+        path: "/followaduit",
+        component: () => import("@/views/followupentry/followaduit"),
+        hidden: true,
+        name: "followaduit",
+      },
+    ],
+  },
   {
     path: "/401",
     name: "401",
diff --git a/src/views/audit-qualitycontrol/hospital.vue b/src/views/audit-qualitycontrol/hospital.vue
index 5d8ff61..c1ae726 100644
--- a/src/views/audit-qualitycontrol/hospital.vue
+++ b/src/views/audit-qualitycontrol/hospital.vue
@@ -106,7 +106,7 @@ export default {
     auditHandle(data, i) {
       console.log(data,i)
       if(this.type=="1"){
-        this.$router.push("/followupentry")
+        this.$router.push("/followaduit")
       }
     },
   },
diff --git a/src/views/followupentry/followaduit.vue b/src/views/followupentry/followaduit.vue
new file mode 100644
index 0000000..e24c5d9
--- /dev/null
+++ b/src/views/followupentry/followaduit.vue
@@ -0,0 +1,237 @@
+<template>
+  <!-- 随访调查录入 -->
+  <div>
+    <ConfigForms form-type="2" formClass="follow-form"></ConfigForms>
+  </div>
+</template>
+
+<script>
+import ConfigForms from "@/views/screening/components/ConfigForms.vue"
+export default {
+  name: "FollowupEntry",
+  components: {
+    ConfigForms,
+  },
+  data() {
+    return {
+      form:{
+        column: [],
+        labelPosition: 'right',
+        labelSuffix: '：',
+        labelWidth: 100,
+        gutter: 0,
+        menuBtn: true,
+        submitBtn: true,
+        submitText: '提交',
+        emptyBtn: true,
+        emptyText: '清空',
+        nextTabBtn: true,
+        nextTabText: '下一页',
+        menuPosition: 'center',
+        group: [
+          {
+          label: '个人信息',
+          prop: '1669858228269_22763',
+          arrow: true,
+          collapse: true,
+          display: true,
+          labelWidth: 8,
+          column: [{
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'name',
+            label: '姓名',
+            fieldType: 'varchar',
+            fieldLength: '50',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'contact_phone',
+            label: '手机号',
+            fieldType: 'varchar',
+            fieldLength: '20',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'telephone',
+            label: '联系电话',
+            fieldType: 'varchar',
+            fieldLength: '20',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'sex',
+            label: '性别',
+            fieldType: 'tinyint',
+            fieldLength: '2',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'birthday',
+            label: '出生日期',
+            fieldType: 'date',
+            fieldLength: '',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'age',
+            label: '年龄',
+            fieldType: 'int',
+            fieldLength: '4',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }]
+        }, 
+        {
+          label: '第一次随访计划',
+          prop: '1669858313508_15760',
+          arrow: true,
+          collapse: true,
+          display: true,
+          labelWidth: 8,
+          column: [{
+            type: 'radio',
+            display: true,
+            importantField: true,
+            styles: {},
+            prop: 'is_continue_follow',
+            label: '是否随访',
+            dicData: [{
+              label: '是',
+              value: '1',
+              id: '1595347527757000705',
+              parentId: ''
+            }, {
+              label: '否',
+              value: '0',
+              id: '1595347502595371010',
+              parentId: ''
+            }],
+            dynamicshSet: [],
+            dicType: 'd-sf',
+            props: {
+              label: 'label',
+              value: 'value'
+            },
+            fieldType: 'tinyint',
+            fieldLength: '2',
+            tableName: '随访计划',
+            tableCode: 'gas_follow',
+            tableId: '1597491580053323777',
+            notFilter: false,
+            cType: '',
+            subfield: false,
+            value: '1',
+            span: 24,
+            autoRequired: 0,
+            personalRequired: 0
+          }, {
+            type: 'date',
+            display: true,
+            importantField: true,
+            styles: {},
+            prop: 'first_follow_time',
+            label: '随访时间',
+            format: 'yyyy-MM-dd',
+            valueFormat: 'yyyy-MM-dd',
+            dicType: '',
+            fieldType: 'date',
+            tableName: '随访计划',
+            tableCode: 'gas_follow',
+            tableId: '1597491580053323777',
+            notFilter: false,
+            cType: '',
+            subfield: false,
+            span: 12,
+            autoRequired: 0,
+            personalRequired: 0,
+            width: 12
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            prop: 'follow_contents',
+            label: '随访内容',
+            fieldType: 'text',
+            tableName: '随访计划',
+            tableCode: 'gas_follow',
+            tableId: '1597491580053323777',
+            notFilter: false,
+            cType: '',
+            subfield: false,
+            autoRequired: 0,
+            personalRequired: 0,
+            span: 12,
+            width: 12
+          }]
+        }, 
+        ]
+      }
+    }
+  },
+  created() {},
+  methods: {},
+}
+</script>
+
+<style lang="scss">
+</style>
diff --git a/src/views/followupentry/index.vue b/src/views/followupentry/index.vue
index c1ee114..e24c5d9 100644
--- a/src/views/followupentry/index.vue
+++ b/src/views/followupentry/index.vue
@@ -1,6 +1,8 @@
 <template>
   <!-- 随访调查录入 -->
-  <ConfigForms form-type="2" formClass="follow-form"></ConfigForms>
+  <div>
+    <ConfigForms form-type="2" formClass="follow-form"></ConfigForms>
+  </div>
 </template>
 
 <script>
@@ -11,7 +13,220 @@ export default {
     ConfigForms,
   },
   data() {
-    return {}
+    return {
+      form:{
+        column: [],
+        labelPosition: 'right',
+        labelSuffix: '：',
+        labelWidth: 100,
+        gutter: 0,
+        menuBtn: true,
+        submitBtn: true,
+        submitText: '提交',
+        emptyBtn: true,
+        emptyText: '清空',
+        nextTabBtn: true,
+        nextTabText: '下一页',
+        menuPosition: 'center',
+        group: [
+          {
+          label: '个人信息',
+          prop: '1669858228269_22763',
+          arrow: true,
+          collapse: true,
+          display: true,
+          labelWidth: 8,
+          column: [{
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'name',
+            label: '姓名',
+            fieldType: 'varchar',
+            fieldLength: '50',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'contact_phone',
+            label: '手机号',
+            fieldType: 'varchar',
+            fieldLength: '20',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'telephone',
+            label: '联系电话',
+            fieldType: 'varchar',
+            fieldLength: '20',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'sex',
+            label: '性别',
+            fieldType: 'tinyint',
+            fieldLength: '2',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'birthday',
+            label: '出生日期',
+            fieldType: 'date',
+            fieldLength: '',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'age',
+            label: '年龄',
+            fieldType: 'int',
+            fieldLength: '4',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }]
+        }, 
+        {
+          label: '第一次随访计划',
+          prop: '1669858313508_15760',
+          arrow: true,
+          collapse: true,
+          display: true,
+          labelWidth: 8,
+          column: [{
+            type: 'radio',
+            display: true,
+            importantField: true,
+            styles: {},
+            prop: 'is_continue_follow',
+            label: '是否随访',
+            dicData: [{
+              label: '是',
+              value: '1',
+              id: '1595347527757000705',
+              parentId: ''
+            }, {
+              label: '否',
+              value: '0',
+              id: '1595347502595371010',
+              parentId: ''
+            }],
+            dynamicshSet: [],
+            dicType: 'd-sf',
+            props: {
+              label: 'label',
+              value: 'value'
+            },
+            fieldType: 'tinyint',
+            fieldLength: '2',
+            tableName: '随访计划',
+            tableCode: 'gas_follow',
+            tableId: '1597491580053323777',
+            notFilter: false,
+            cType: '',
+            subfield: false,
+            value: '1',
+            span: 24,
+            autoRequired: 0,
+            personalRequired: 0
+          }, {
+            type: 'date',
+            display: true,
+            importantField: true,
+            styles: {},
+            prop: 'first_follow_time',
+            label: '随访时间',
+            format: 'yyyy-MM-dd',
+            valueFormat: 'yyyy-MM-dd',
+            dicType: '',
+            fieldType: 'date',
+            tableName: '随访计划',
+            tableCode: 'gas_follow',
+            tableId: '1597491580053323777',
+            notFilter: false,
+            cType: '',
+            subfield: false,
+            span: 12,
+            autoRequired: 0,
+            personalRequired: 0,
+            width: 12
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            prop: 'follow_contents',
+            label: '随访内容',
+            fieldType: 'text',
+            tableName: '随访计划',
+            tableCode: 'gas_follow',
+            tableId: '1597491580053323777',
+            notFilter: false,
+            cType: '',
+            subfield: false,
+            autoRequired: 0,
+            personalRequired: 0,
+            span: 12,
+            width: 12
+          }]
+        }, 
+        ]
+      }
+    }
   },
   created() {},
   methods: {},
diff --git a/src/views/screening/components/ConfigForms.vue b/src/views/screening/components/ConfigForms.vue
index 5e7b59a..c6e1ac6 100644
--- a/src/views/screening/components/ConfigForms.vue
+++ b/src/views/screening/components/ConfigForms.vue
@@ -27,6 +27,7 @@
                   contrast
                   @setFormJson="setFormJson"
                   @handleConfirm="handleConfirm"
+                  :survivalFlag="survivalFlag"
                 ></form-tab>
               </template>
             </div>
@@ -40,6 +41,7 @@
 
 <script>
 import mixin from "./mixin"
+import CustomForm from "@/components/FormComponents/CustomForm/index"
 
 export default {
   name: "ConfigForms",
@@ -52,7 +54,8 @@ export default {
   },
   data() {
     return {
-      showIndex:false
+      // showIndex:false,
+      // survivalFlag:false
     }
   },
   methods: {
@@ -65,14 +68,34 @@ export default {
     this.getCurrentFormByType(this.formType)
   },
   watch: {
-    activeName(val){
-      if(val=="index0" && this.formClass){
-        this.showIndex = false
-        console.log(1)
+    // activeName(val){
+    //   if(val=="index0" && this.formClass){
+    //     this.showIndex = false
+    //     // this.survivalFlag = true
+    //     console.log(1)
+    //   }
+    //   else{
+    //     this.showIndex = true
+    //     // this.survivalFlag = false
+    //     console.log(2)
+    //   }
+    // }
+  },
+  computed:{
+    survivalFlag(){
+      if(this.activeName=="index0" && this.formClass){
+        return true
+      }
+      else{
+        return false
+      }
+    },
+    showIndex(){
+      if(this.activeName=="index0" && this.formClass){
+        return false
       }
       else{
-        this.showIndex = true
-        console.log(2)
+        return true
       }
     }
   },
diff --git a/src/views/screening/components/FormTab.vue b/src/views/screening/components/FormTab.vue
index f278ded..365f0f2 100644
--- a/src/views/screening/components/FormTab.vue
+++ b/src/views/screening/components/FormTab.vue
@@ -7,7 +7,7 @@
         :title="asideShow ? '收起' : '展开'"
         class="arrow"
         @click="asideShow = !asideShow"
-      ></i> -->
+      ></i>-->
       <el-empty v-if="isEmpty" description="暂无数据"></el-empty>
       <template v-if="!isEmpty">
         <!-- 多次记录 -->
@@ -32,7 +32,7 @@
             <span class="value"
               >{{ formData.percent.personalPercent }}%</span
             ></template
-          > -->
+          >-->
 
           <div class="label">
             <!-- 仅显示重要字段 ： -->
@@ -42,11 +42,8 @@
             </el-switch>-->
           </div>
         </el-row>
-        <div
-          class="my-form"
-          ref="my-form"
-          :class="externalScroll ? 'no-scroll' : ''"
-        >
+        <div class="my-form" ref="my-form" :class="externalScroll ? 'no-scroll' : ''">
+          <read-form ref="form" :options="survivalForm" v-if="survivalFlag"></read-form>
           <custom-form
             ref="form"
             @scrollTop="scrollTop"
@@ -71,6 +68,7 @@
 import { getPatientDetail, getRecordList } from "@/api/patient.js"
 import { getFormDetail } from "@/api/field"
 import CustomForm from "@/components/FormComponents/CustomForm/index"
+import ReadForm from "@/components/FormComponents/ReadForm/index"
 import TagsScrollBar from "@/components/TagsScrollBar/index"
 export default {
   name: "FormTab",
@@ -82,8 +80,9 @@ export default {
     patientId: String,
     patientStandbyId: String,
     getAll: Boolean, // 获取页面所有数据
+    survivalFlag:Boolean, //存活的显示
   },
-  components: { CustomForm, TagsScrollBar },
+  components: { CustomForm, TagsScrollBar,ReadForm },
   provide() {
     return {
       formId: this.form.formId,
@@ -107,6 +106,218 @@ export default {
       formloading: false,
       repeatedlyList: [],
       formCacheList: [],
+      survivalForm:{
+        column: [],
+        labelPosition: 'right',
+        labelSuffix: '：',
+        labelWidth: 100,
+        gutter: 0,
+        menuBtn: true,
+        submitBtn: true,
+        submitText: '提交',
+        emptyBtn: true,
+        emptyText: '清空',
+        nextTabBtn: true,
+        nextTabText: '下一页',
+        menuPosition: 'center',
+        group: [
+          {
+          label: '个人信息',
+          prop: '1669858228269_22763',
+          arrow: true,
+          collapse: true,
+          display: true,
+          labelWidth: 8,
+          column: [{
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'name',
+            label: '姓名',
+            fieldType: 'varchar',
+            fieldLength: '50',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'contact_phone',
+            label: '手机号',
+            fieldType: 'varchar',
+            fieldLength: '20',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'telephone',
+            label: '联系电话',
+            fieldType: 'varchar',
+            fieldLength: '20',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'sex',
+            label: '性别',
+            fieldType: 'tinyint',
+            fieldLength: '2',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'birthday',
+            label: '出生日期',
+            fieldType: 'date',
+            fieldLength: '',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            autoRequired: 0,
+            personalRequired: 0,
+            prop: 'age',
+            label: '年龄',
+            fieldType: 'int',
+            fieldLength: '4',
+            tableName: '存活情况',
+            tableCode: 'gas_survival_situation',
+            tableId: '1598137567272861697',
+            notFilter: false,
+            cType: '',
+            subfield: false
+          }]
+        }, 
+        {
+          label: '第一次随访计划',
+          prop: '1669858313508_15760',
+          arrow: true,
+          collapse: true,
+          display: true,
+          labelWidth: 8,
+          column: [{
+            type: 'radio',
+            display: true,
+            importantField: true,
+            styles: {},
+            prop: 'is_continue_follow',
+            label: '是否随访',
+            dicData: [{
+              label: '是',
+              value: '1',
+              id: '1595347527757000705',
+              parentId: ''
+            }, {
+              label: '否',
+              value: '0',
+              id: '1595347502595371010',
+              parentId: ''
+            }],
+            dynamicshSet: [],
+            dicType: 'd-sf',
+            props: {
+              label: 'label',
+              value: 'value'
+            },
+            fieldType: 'tinyint',
+            fieldLength: '2',
+            tableName: '随访计划',
+            tableCode: 'gas_follow',
+            tableId: '1597491580053323777',
+            notFilter: false,
+            cType: '',
+            subfield: false,
+            value: '1',
+            span: 24,
+            autoRequired: 0,
+            personalRequired: 0
+          }, {
+            type: 'date',
+            display: true,
+            importantField: true,
+            styles: {},
+            prop: 'first_follow_time',
+            label: '随访时间',
+            format: 'yyyy-MM-dd',
+            valueFormat: 'yyyy-MM-dd',
+            dicType: '',
+            fieldType: 'date',
+            tableName: '随访计划',
+            tableCode: 'gas_follow',
+            tableId: '1597491580053323777',
+            notFilter: false,
+            cType: '',
+            subfield: false,
+            span: 12,
+            autoRequired: 0,
+            personalRequired: 0,
+            width: 12
+          }, {
+            type: 'input',
+            display: true,
+            importantField: true,
+            styles: {},
+            prop: 'follow_contents',
+            label: '随访内容',
+            fieldType: 'text',
+            tableName: '随访计划',
+            tableCode: 'gas_follow',
+            tableId: '1597491580053323777',
+            notFilter: false,
+            cType: '',
+            subfield: false,
+            autoRequired: 0,
+            personalRequired: 0,
+            span: 12,
+            width: 12
+          }]
+        }, 
+        ]
+      }
     }
   },
   // mixins: [resizeMixin],
diff --git a/src/views/screening/components/mixin.js b/src/views/screening/components/mixin.js
index e8af61f..091db9d 100644
--- a/src/views/screening/components/mixin.js
+++ b/src/views/screening/components/mixin.js
@@ -24,6 +24,7 @@ export default {
   methods: {
     handleTabClick({ index, name }) {
       const { formId, id, silent } = this.formTabs[index]
+      console.log('表单项', this.formTabs)
       if (formId && silent) {
         this.formTabs[index]["silent"] = false //控制是否获取接口数据
         return
-- 
2.22.0