审核表单，仍有问题

src/components/FormComponents/CustomForm/FormContent.vue

@@ -189,6 +189,7 @@ export default {
     },
     // 切换不符合筛查条件的显示
     formChange() {
+      // 入选，排除标准
       console.log(this.form)
       let arr = [
         "is_one_year",

src/components/FormComponents/CustomForm/FormItemSelf.vue

@@ -9,7 +9,10 @@
       :lg="item.width"
       :style="{ height: item.type === 'upload' ? '116px' : '53px' }"
     >
-      <div v-if="showIndex" class="formIndex">
+      <div
+        v-if="showIndex"
+        :class="['formIndex', item.labelSuffix == '5' ? 'computeIndex' : '']"
+      >
         {{ item.labelSuffix || columnIndex + 1 }}
       </div>
       <!-- <el-form-item
@@ -48,7 +51,7 @@
               <el-input
                 v-if="item.type === 'input'"
                 v-model="form[item.prop]"
-                :class="item.toothBit ? 'toothBit' : ''"
+                :class="item.prop == 'other_sickness' ? 'needlong' : ''"
                 :readonly="item.readonly"
                 :disabled="item.disabled"
                 :placeholder="
@@ -559,23 +562,6 @@ export default {
             } 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) {
-        //   }
-        // }
       }
     },
     // 自定义方法规则
@@ -640,6 +626,7 @@ export default {
             const columns = this.columns || []
             const group = this.group || []
             const dyMap = {} // 显示数据集合
+
             dynamicshSet.forEach((dy) => {
               if (dyMap[dy.target]) {
                 dyMap[dy.target].push(dy.value)
@@ -657,7 +644,38 @@ export default {
               const values = dyMap[key]
               let display = false
               if (Array.isArray(val)) {
+                if (
+                  prop == "early_gastric_cancer" ||
+                  prop == "period_gastric_cancer"
+                ) {
+                  let flag = false
+                  if (this.form.early_gastric_cancer) {
+                    this.form.early_gastric_cancer.length > 0
+                      ? (flag = true)
+                      : (flag = false)
+                  }
+                  if (!flag) {
+                    if (this.form.period_gastric_cancer) {
+                      this.form.period_gastric_cancer.length > 0
+                        ? (flag = true)
+                        : (flag = false)
+                    }
+                  }
+                  console.log(targetItem)
+                  display = flag
+                  if (display) {
+                    targetItem.rules[0] = {
+                      required: true,
+                      message: "请上传病理报告",
+                    }
+                  } else {
+                    if (targetItem.rules.length > 0) {
+                      targetItem.rules[0].required = false
+                    }
+                  }
+                } else {
                   display = values.filter((v) => val.includes(v)).length > 0
+                }
               } else {
                 display = values.includes(val)
               }
@@ -678,6 +696,14 @@ export default {
                   this.$set(this.form, "$_hidden" + targetItem.prop, !display)
                 }, 200)
               } else {
+                if (prop == "check_type" && Boolean(display)) {
+                  targetItem.rules[0] = {
+                    required: true,
+                    message: "请上传内镜报告",
+                  }
+                } else if (prop == "check_type") {
+                  targetItem.rules = []
+                }
                 this.$set(targetItem, "display", Boolean(display))
               }
             })
@@ -849,4 +875,7 @@ export default {
     }
   }
 }
+::v-deep .needlong {
+  width: 260px !important;
+}
 </style>

src/components/FormComponents/CustomForm/index.vue

@@ -49,7 +49,9 @@
           >
             <template slot="title">
               {{ g.label }}
-              <span v-if="g.label == '二、排除标准'" class="noCol">{{errorText}}</span>
+              <span v-if="g.label == '二、排除标准'" class="noCol">{{
+                errorText
+              }}</span>
             </template>
             <form-content
               v-if="collapseNames.includes(g.prop)"
@@ -85,7 +87,8 @@
             size="large"
             :disabled="disabled"
             @click="handleConfirm"
-          >{{ options.submitText || "提交" }}</el-button>
+            >{{ options.submitText || "提交" }}</el-button
+          >
         </template>
         <template v-if="options.emptyBtn">
           <el-button
@@ -93,7 +96,8 @@
             icon="el-icon-delete "
             size="large"
             @click="resetForm(true)"
-          >{{ options.emptyText || "清空" }}</el-button>
+            >{{ options.emptyText || "清空" }}</el-button
+          >
         </template>
       </template>
       <template v-if="nextTabBtnShow">
@@ -103,7 +107,8 @@
             icon="el-icon-caret-right"
             size="large"
             @click="nextTab"
-          >{{ options.nextTabText || "下一页" }}</el-button>
+            >{{ options.nextTabText || "下一页" }}</el-button
+          >
         </el-form>
       </template>
     </div>
@@ -180,7 +185,20 @@ export default {
       // this.setformWatch(this.options, "form")
     })
   },
-
+  mounted() {
+    // 处理computeIndex
+    let domArr = document.querySelectorAll(".computeIndex")
+    for (let i = 0; i < domArr.length; i++) {
+      domArr[i].style.height = "54px"
+      domArr[i].innerHTML = ""
+      if (domArr.length / i == 2) {
+        domArr[i].innerHTML = "6"
+      }
+      if (i == domArr.length - 1) {
+        domArr[i].style.height = "53px"
+      }
+    }
+  },
   methods: {
     // 显示不符合筛查条件
     showError(data) {

src/views/audit-detail/components/publicDialog.vue

@@ -3,17 +3,12 @@
     <el-dialog
       center
       :visible.sync="dialogVisible"
-      width="30%"
+      width="40%"
       show-close
       @closed="cancelSubmit"
     >
       <slot name="content"></slot>
-      <span slot="footer" class="dialog-footer">
-        <el-button @click="cancelSubmit">取 消</el-button>
-        <el-button type="primary" @click="onSubmit" :loading="loading"
-          >确 定</el-button
-        >
-      </span>
+      <slot name="footer"></slot>
     </el-dialog>
   </div>
 </template>
@@ -29,9 +24,9 @@ export default {
       this.dialogVisible = false
       this.$emit("onCancel")
     },
-    onSubmit() {
-      this.$emit("onSubmit")
-    },
+    // onSubmit() {
+    //   this.$emit("onSubmit")
+    // },
   },
 }
 </script>

src/views/audit-detail/components/screenReview.vue

+<template>
+  <div>
+    <el-container>
+      <el-main v-loading="pageLoading" class="transition-box">
+        <el-empty v-if="!isEmpty" description="暂无数据"></el-empty>
+        <template v-if="isEmpty">
+          <div ref="my-form" class="my-form">
+            <custom-form
+              ref="customForm"
+              :options="jsonList[1]"
+              :formEdit="form"
+            ></custom-form>
+            <!-- <custom-form ref="form" :options="jsonList[1]"></custom-form>
+            <custom-form ref="form" :options="jsonList[2]"></custom-form>
+            <custom-form ref="form" :options="jsonList[3]"></custom-form>
+            <custom-form ref="form" :options="jsonList[4]"></custom-form> -->
+          </div>
+        </template>
+      </el-main>
+      <!-- <el-aside
+        :width="sideWidth"
+        class="transition-box"
+        :class="{ hidden: !asideShow }"
+        v-if="contrast"
+      >
+        <div class="side-content"></div>
+      </el-aside> -->
+    </el-container>
+  </div>
+</template>
+<script>
+import { mapGetters } from "vuex"
+import CustomForm from "@/components/FormComponents/CustomForm/index"
+import { getCurrentFormByType } from "@/api/coop-group.js"
+import { getFormDetail } from "@/api/field"
+export default {
+  components: { CustomForm },
+  data() {
+    return {
+      fromLoading: false,
+      formTabs: [],
+      formTabsList: [],
+      jsonList: [],
+      form: {
+        name: "123",
+        phone: "18712412341",
+      },
+    }
+  },
+  computed: {
+    ...mapGetters({
+      group: ["user/group"],
+    }),
+    isEmpty() {
+      return this.jsonList.length
+    },
+    sideWidth() {
+      return this.asideShow ? "200px" : "0px"
+    },
+    pageLoading() {
+      return this.loading || this.formloading
+    },
+  },
+  watch: {},
+  created() {
+    this.getCurrentFormByType()
+  },
+  mounted() {},
+
+  methods: {
+    getCurrentFormByType(type = 1) {
+      this.fromLoading = true
+      getCurrentFormByType({
+        type,
+        groupId: this.group.groupId,
+      })
+        .then((res) => {
+          if (res.code === 1) {
+            const formTabs = []
+            this.formTabsList = res.data.map((item, index) => {
+              if (index === 0) {
+                formTabs.push({
+                  silent: false,
+                  ...item,
+                  label: item.tabName,
+                })
+              } else {
+                formTabs.push({
+                  id: item.id,
+                  formId: item.formId,
+                  silent: true,
+                  label: item.tabName,
+                })
+              }
+              return {
+                ...item,
+                silent: false,
+                label: item.tabName,
+              }
+            })
+            this.formTabs = formTabs
+          }
+        })
+        .finally(() => {
+          this.jsonList = []
+          let i = 0
+          this.initForm(i)
+        })
+    },
+    initForm(i) {
+      let formId = this.formTabs[i].formId
+      this.formloading = true
+      getFormDetail(formId)
+        .then((res) => {
+          if (res.code === 1 && res.data) {
+            const formJson = res.data.formJson
+            const obj = eval("(" + formJson + ")")
+            obj.disabled = true
+            obj.detail = true
+            this.jsonList.push(obj)
+            if (i == 4) {
+              console.log(this.jsonList)
+              this.formloading = false
+            }
+          }
+        })
+        .finally(() => {
+          if (i < this.formTabs.length - 1) {
+            i++
+            this.initForm(i)
+          }
+        })
+    },
+  },
+}
+</script>
+<style lang="scss" scoped></style>

src/views/audit-detail/index.vue

@@ -6,11 +6,11 @@
         <span class="f-b">【无锡市人民医院医联体】【剩余7】</span>
       </div>
       <div class="right">
-        <el-button class="btn">返回</el-button>
+        <el-button class="btn" @click="$router.go(-1)">返回</el-button>
       </div>
     </div>
     <div class="choose-handle p-24">
-      <span>请选择审核结果:</span>
+      <span v-if="!editStatus">请选择审核结果:</span>
       <div class="btn_group">
         <el-button
           v-for="(item, index) in btnGroup"
@@ -21,27 +21,107 @@
           @click="showDialog(item.value)"
           >{{ item.text }}</el-button
         >
+        <span v-if="editStatus" class="op">驳回修改建议:胃镜图片不合规</span>
       </div>
     </div>
     <div class="table-content p-24">
-      <!-- <component :is="curComponent"></component> -->
+      <component :is="curComponent"></component>
     </div>
+    <public-dialog ref="editDialog" @onSubmit="onSubmit" @onCancel="onCancel">
+      <!-- 修改审核结果 优先触发提示 -->
+      <template v-if="!confirmStatus" slot="content">
+        <div class="title">温馨提示</div>
+        <div class="content">
+          <div class="showTips">
+            该病例已经审核【驳回修改】，需要改为{{
+              btnGroup[curBtn - 1] ? btnGroup[curBtn - 1].text : ""
+            }}吗
+          </div>
+        </div>
+        <div class="btn">
+          <el-button type="primary" :loading="loading" @click="onCancel"
+            >否</el-button
+          >
+          <el-button type="primary" :loading="loading" @click="editSubmit"
+            >是</el-button
+          >
+        </div>
+      </template>
+    </public-dialog>
     <public-dialog ref="publicDialog" @onSubmit="onSubmit" @onCancel="onCancel">
+      <!-- 审核结果回显 -->
       <template v-if="!confirmStatus" slot="content">
-        <span class="tips">确定提交审核?</span>
+        <div class="title">
+          {{ btnGroup[curBtn - 1] ? btnGroup[curBtn - 1].text : "" }}
+        </div>
+        <div class="content">
+          <div v-if="curBtn != 1" class="noPass">
+            <el-form
+              ref="form"
+              label-position="top"
+              :model="form"
+              :rules="rules"
+              label-width="100px"
+              class="demo-ruleForm"
+            >
+              <el-form-item
+                :label="curBtn == 2 ? '不合格原因' : '驳回修改建议'"
+                prop="reson"
+              >
+                <el-input
+                  v-model="form.reson"
+                  type="textarea"
+                  :placeholder="
+                    curBtn == 2 ? '请填写不合格原因' : '请填写驳回修改建议'
+                  "
+                ></el-input>
+              </el-form-item>
+            </el-form>
+          </div>
+        </div>
+        <div class="btn">
+          <el-button type="primary" :loading="loading" @click="onSubmit"
+            >确 定</el-button
+          >
+        </div>
       </template>
+      <!-- 提交后结果 -->
       <template v-if="confirmStatus" slot="content">
-        {{ btnGroup[curBtn - 1].text }}
+        <div class="title">{{ btnGroup[curBtn - 1].text }}</div>
+        <div class="content">
+          <div v-if="curBtn == 1" class="pass">该病例审核合格成功！</div>
+          <div v-if="curBtn != 1" class="noPass">
+            <!-- 不合格和驳回 -->
+            <div class="label">
+              {{ curBtn == 2 ? "不合格原因" : "驳回修改建议" }}
+            </div>
+            <div class="reson">
+              {{ form.reson }}
+            </div>
+          </div>
+        </div>
+        <div v-if="curBtn != 1" class="showTips">
+          该病例审核{{ curBtn == 2 ? "不合格原因" : "驳回修改建议" }}提交成功！
+        </div>
+        <div class="btn">
+          <el-button type="primary" @click="nextExample">下一例</el-button>
+        </div>
       </template>
     </public-dialog>
   </div>
 </template>
 <script>
 import publicDialog from "./components/publicDialog.vue"
+import screenReview from "./components/screenReview.vue"
 export default {
-  components: { publicDialog },
+  components: { publicDialog, screenReview },
   data() {
     return {
+      editStatus: false, //进入的状态是第一次审核还是修改审核,false为第一次,true为修改
+      form: {},
+      rules: {
+        reson: [{ required: true, message: "请填写", trigger: "blur" }],
+      },
       btnGroup: [
         {
           text: "合格",
@@ -56,8 +136,9 @@ export default {
           value: 3,
         },
       ],
+      loading: false,
       curBtn: 0,
-      curComponent: "",
+      curComponent: "screenReview",
       confirmStatus: false,
     }
   },
@@ -66,14 +147,66 @@ export default {
   methods: {
     showDialog(val) {
       this.curBtn = val
+      if (!this.editStatus) {
+        if (this.curBtn == 1) {
+          // 走接口，保存合格
+          this.confirmStatus = true
+        } else if (this.curBtn == 2) {
+          this.rules.reson[0].message = "请输入不合格原因"
+        } else {
+          this.rules.reson[0].message = "请输入驳回修改建议"
+        }
         this.$refs.publicDialog.dialogVisible = true
+      } else {
+        this.$refs.editDialog.dialogVisible = true
+      }
     },
     onSubmit() {
+      this.loading = true
+      // 切换文本
+      if (this.curBtn != 1) {
+        this.$refs.form.validate((valid) => {
+          if (valid) {
+            // alert("submit!")
+            // 保存成功，回显,调用接口
+
+            // 回调
             this.confirmStatus = true
+          } else {
+            console.log("error submit!!")
+            return false
+          }
+        })
+      }
+
+      this.loading = false
       // this.$refs.publicDialog.dialogVisible = true
     },
     onCancel() {
       this.confirmStatus = false
+      if (this.curBtn != 1) {
+        this.form = {}
+      }
+      this.$refs.editDialog.dialogVisible = false
+      this.$refs.publicDialog.dialogVisible = false
+      if (this.$refs.form) {
+        this.$refs.form.clearValidate()
+      }
+    },
+    editSubmit() {
+      // this.$refs.editDialog.dialogVisible = false
+      if (this.curBtn == 1) {
+        // 走接口，保存合格
+        this.confirmStatus = true
+      } else if (this.curBtn == 2) {
+        this.rules.reson[0].message = "请输入不合格原因"
+      } else {
+        this.rules.reson[0].message = "请输入驳回修改建议"
+      }
+      this.$refs.publicDialog.dialogVisible = true
+    },
+    nextExample() {
+      this.onCancel()
     },
   },
 }
@@ -128,4 +261,47 @@ export default {
     }
   }
 }
+.title {
+  height: 26px;
+  font-size: 22px;
+  font-family: AlibabaPuHuiTiM;
+  color: rgba(0, 0, 0, 0.8);
+  line-height: 26px;
+}
+.content {
+  margin: 58px;
+  .pass {
+    font-size: 18px;
+    font-family: AlibabaPuHuiTiM;
+    color: #30b9a6;
+    letter-spacing: 1px;
+  }
+}
+.btn {
+  margin-top: 20px;
+  .el-button {
+    width: 100px;
+    height: 32px;
+  }
+}
+::v-deep .el-form-item__label {
+  width: 100%;
+  text-align: left;
+}
+.reson {
+  margin-top: 20px;
+}
+.showTips {
+  color: #4e68ff;
+}
+.op {
+  font-size: 14px;
+  font-family: AlibabaPuHuiTiR;
+  color: #fa6400;
+  margin-left: 20px;
+}
+.table-content {
+  padding-top: 20px;
+  padding-bottom: 20px;
+}
 </style>