监测对象需求变更完成

examples/App.vue

@@ -151,7 +151,6 @@ html, body {
   height: 100%;
   display: flex;
   flex-direction: column;
-  gap: 5px;
 
   .fixedBtn {
     position: fixed;
@@ -191,11 +190,12 @@ html, body {
   & > .header {
     text-align: start;
     box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
-    height: 60px;
+    height: 43px;
     flex-shrink: 0;
     display: flex;
     align-items: center;
     padding: 0 16px;
+    margin-bottom: 5px;
 
     & > b {
       flex: 1;

packages/jianping/AppHelpedResident/detail/hrLog.vue

@@ -0,0 +1,145 @@
+<template>
+  <section class="hrLog">
+    <ai-card title="走访日志">
+      <template #right>
+        <el-button type="text" icon="el-icon-plus" @click="dialog=true">添加</el-button>
+      </template>
+      <template #content>
+        <div class="logItem" v-for="row in tableData" :key="row.id">
+          <el-row type="flex" align="middle" justify="space-between">
+            <b v-text="row.createUserName"/>
+            <span v-text="row.createTime"/>
+          </el-row>
+          <div class="content" v-text="row.detail"/>
+          <ai-uploader v-model="row.files" disabled/>
+          <div class="btns">
+            <el-button type="text" @click="handleEdit(row)">编辑</el-button>
+            <el-button type="text" @click="handleDelete(row.id)">删除</el-button>
+          </div>
+        </div>
+        <ai-empty v-if="tableData.length==0"/>
+      </template>
+    </ai-card>
+    <ai-dialog :visible.sync="dialog" :title="addTitle" @closed="form={}" @onConfirm="submit" width="600px">
+      <el-form :model="form" :rules="rules" ref="DialogForm" size="small" label-width="80px">
+        <el-form-item label="走访日志" prop="detail">
+          <el-input type="textarea" v-model="form.detail" placeholder="请输入" maxlength="500" show-word-limit rows="5"/>
+        </el-form-item>
+        <el-form-item label="图片" prop="files">
+          <ai-uploader v-model="form.files" :instance="instance" acceptType=".jpg,.jpeg,.png">
+            <template #tips>
+              最多9张,仅支持10M以内的jpg、jpeg、png格式照片
+            </template>
+          </ai-uploader>
+        </el-form-item>
+      </el-form>
+    </ai-dialog>
+  </section>
+</template>
+
+<script>
+import {mapState} from "vuex";
+
+export default {
+  name: "hrLog",
+  props: {
+    instance: Function,
+    dict: Object,
+    permissions: Function
+  },
+  computed: {
+    ...mapState(['user']),
+    addTitle() {
+      return this.form.id ? "编辑走访日志" : "新建走访日志"
+    }
+  },
+  data() {
+    return {
+      dialog: false,
+      form: {},
+      rules: {
+        detail: {required: true, message: "请输入走访日志"}
+      },
+      tableData: []
+    }
+  },
+  methods: {
+    getTableData() {
+      let {id: pid} = this.$route.query
+      this.instance.post("/app/apppreventionreturntopovertylog/list", null, {
+        params: {size: 9999, pid, type: 0}
+      }).then(res => {
+        if (res?.data) {
+          this.tableData = res.data?.records || []
+        }
+      })
+    },
+    submit() {
+      this.$refs.DialogForm.validate(v => {
+        if (v) {
+          let {id: pid} = this.$route.query
+          this.instance.post(`/app/apppreventionreturntopovertylog/addOrUpdate`, {
+            ...this.form,
+            pid,
+            type: 0
+          }).then(res => {
+            if (res.code == 0) {
+              this.$message.success('提交成功!');
+              this.dialog = false
+              this.getTableData()
+            }
+          })
+        }
+      })
+    },
+    handleEdit(row) {
+      this.dialog = true
+      this.form = JSON.parse(JSON.stringify(row))
+    },
+    handleDelete(ids) {
+      this.$confirm("是否要删除走访日志").then(() => {
+        this.instance.post("/app/apppreventionreturntopovertylog/delete", null, {
+          params: {ids: ids?.toString()}
+        }).then(res => {
+          if (res?.code == 0) {
+            this.$message.success("删除成功!")
+            this.getTableData()
+          }
+        })
+      }).catch(() => 0)
+    },
+  },
+  created() {
+    this.getTableData()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.hrLog {
+  .logItem {
+    position: relative;
+    padding: 8px 16px;
+    border-radius: 4px;
+
+    &:hover {
+      background: #eee;
+
+      .btns {
+        display: block;
+      }
+    }
+
+    .content {
+      margin: 8px 0;
+    }
+
+    .btns {
+      display: none;
+      position: absolute;
+      right: 8px;
+      bottom: 8px;
+    }
+  }
+}
+</style>

packages/jianping/AppHelpedResident/detail/hrMeasure.vue

@@ -0,0 +1,145 @@
+<template>
+  <section class="hrMeasure">
+    <ai-card title="帮扶措施">
+      <template #right>
+        <el-button type="text" icon="el-icon-plus" @click="dialog=true">添加</el-button>
+      </template>
+      <template #content>
+        <div class="logItem" v-for="row in tableData" :key="row.id">
+          <el-row type="flex" align="middle" justify="space-between">
+            <b v-text="row.createUserName"/>
+            <span v-text="row.createTime"/>
+          </el-row>
+          <div class="content" v-text="row.detail"/>
+          <ai-uploader v-model="row.files" disabled/>
+          <div class="btns">
+            <el-button type="text" @click="handleEdit(row)">编辑</el-button>
+            <el-button type="text" @click="handleDelete(row.id)">删除</el-button>
+          </div>
+        </div>
+        <ai-empty v-if="tableData.length==0"/>
+      </template>
+    </ai-card>
+    <ai-dialog :visible.sync="dialog" :title="addTitle" @closed="form={}" @onConfirm="submit" width="600px">
+      <el-form :model="form" :rules="rules" ref="DialogForm" size="small" label-width="80px">
+        <el-form-item label="帮扶措施" prop="detail">
+          <el-input type="textarea" v-model="form.detail" placeholder="请输入" maxlength="500" show-word-limit rows="5"/>
+        </el-form-item>
+        <el-form-item label="图片" prop="files">
+          <ai-uploader v-model="form.files" :instance="instance" acceptType=".jpg,.jpeg,.png">
+            <template #tips>
+              最多9张,仅支持10M以内的jpg、jpeg、png格式照片
+            </template>
+          </ai-uploader>
+        </el-form-item>
+      </el-form>
+    </ai-dialog>
+  </section>
+</template>
+
+<script>
+import {mapState} from "vuex";
+
+export default {
+  name: "hrMeasure",
+  props: {
+    instance: Function,
+    dict: Object,
+    permissions: Function
+  },
+  computed: {
+    ...mapState(['user']),
+    addTitle() {
+      return this.form.id ? "编辑措施" : "新建措施"
+    }
+  },
+  data() {
+    return {
+      dialog: false,
+      form: {},
+      rules: {
+        detail: {required: true, message: "请输入帮扶措施"}
+      },
+      tableData: []
+    }
+  },
+  methods: {
+    getTableData() {
+      let {id: pid} = this.$route.query
+      this.instance.post("/app/apppreventionreturntopovertylog/list", null, {
+        params: {size: 9999, pid, type: 1}
+      }).then(res => {
+        if (res?.data) {
+          this.tableData = res.data?.records || []
+        }
+      })
+    },
+    submit() {
+      this.$refs.DialogForm.validate(v => {
+        if (v) {
+          let {id: pid} = this.$route.query
+          this.instance.post(`/app/apppreventionreturntopovertylog/addOrUpdate`, {
+            ...this.form,
+            pid,
+            type: 1
+          }).then(res => {
+            if (res.code == 0) {
+              this.$message.success('提交成功!');
+              this.dialog = false
+              this.getTableData()
+            }
+          })
+        }
+      })
+    },
+    handleEdit(row) {
+      this.dialog = true
+      this.form = JSON.parse(JSON.stringify(row))
+    },
+    handleDelete(ids) {
+      this.$confirm("是否要删除帮扶措施").then(() => {
+        this.instance.post("/app/apppreventionreturntopovertylog/delete", null, {
+          params: {ids: ids?.toString()}
+        }).then(res => {
+          if (res?.code == 0) {
+            this.$message.success("删除成功!")
+            this.getTableData()
+          }
+        })
+      }).catch(() => 0)
+    },
+  },
+  created() {
+    this.getTableData()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.hrMeasure {
+  .logItem {
+    position: relative;
+    padding: 8px 16px;
+    border-radius: 4px;
+
+    &:hover {
+      background: #eee;
+
+      .btns {
+        display: block;
+      }
+    }
+
+    .content {
+      margin: 8px 0;
+    }
+
+    .btns {
+      display: none;
+      position: absolute;
+      right: 8px;
+      bottom: 8px;
+    }
+  }
+}
+</style>

packages/jianping/AppHelpedResident/hrDetail.vue

@@ -175,54 +175,27 @@
                 </ai-card>
               </template>
             </el-tab-pane>
-            <el-tab-pane label="帮扶日志" lazy name="log">
-              <ai-card title="帮扶日志">
-                <template #right>
-                  <el-button type="text" icon="el-icon-plus" @click="dialog=true">添加</el-button>
-                </template>
-                <template #content>
-                  <div class="logItem" v-for="row in tableData" :key="row.id">
-                    <el-row type="flex" align="middle" justify="space-between">
-                      <b v-text="row.createUserName"/>
-                      <span v-text="row.createTime"/>
-                    </el-row>
-                    <div class="content" v-text="row.detail"/>
-                    <ai-uploader v-model="row.files" disabled/>
-                    <div class="btns">
-                      <el-button type="text" @click="handleEditLog(row)">编辑</el-button>
-                      <el-button type="text" @click="handleDeleteLog(row.id)">删除</el-button>
-                    </div>
-                  </div>
-                  <ai-empty v-if="tableData.length==0"/>
-                </template>
-              </ai-card>
+            <el-tab-pane label="走访日志" lazy name="HrLog">
+              <hr-log v-if="currentTab=='HrLog'" :instance="instance" :dict="dict" :permissions="permissions"/>
+            </el-tab-pane>
+            <el-tab-pane label="帮扶措施" lazy name="HrMeasure">
+              <hr-measure v-if="currentTab=='HrMeasure'" :instance="instance" :dict="dict" :permissions="permissions"/>
             </el-tab-pane>
           </el-tabs>
         </el-form>
       </template>
     </ai-detail>
-    <ai-dialog :visible.sync="dialog" title="新建日志" @closed="form={}" @onConfirm="submitHelpLog" width="600px">
-      <el-form :model="form" :rules="rules" ref="DialogForm" size="small" label-width="80px">
-        <el-form-item label="帮扶日志" prop="detail">
-          <el-input type="textarea" v-model="form.detail" placeholder="请输入" maxlength="500" show-word-limit rows="5"/>
-        </el-form-item>
-        <el-form-item label="图片" prop="files">
-          <ai-uploader v-model="form.files" :instance="instance" acceptType=".jpg,.jpeg,.png">
-            <template #tips>
-              最多9张,仅支持10M以内的jpg、jpeg、png格式照片
-            </template>
-          </ai-uploader>
-        </el-form-item>
-      </el-form>
-    </ai-dialog>
   </section>
 </template>
 
 <script>
 import {mapState} from "vuex";
+import HrMeasure from "./detail/hrMeasure";
+import HrLog from "./detail/hrLog";
 
 export default {
   name: "hrDetail",
+  components: {HrLog, HrMeasure},
   props: {
     instance: Function,
     dict: Object,
@@ -248,23 +221,10 @@ export default {
       return [countyName, townName, villageName, currentAddress].join("")
     }
   },
-  watch: {
-    currentTab(v) {
-      if (v == "log") {
-        this.getHelpLogs()
-      }
-    }
-  },
   data() {
     return {
       detail: {},
-      dialog: false,
-      form: {},
-      rules: {
-        detail: {required: true, message: "请输入帮扶内容"}
-      },
-      currentTab: "",
-      tableData: []
+      currentTab: ""
     }
   },
   methods: {
@@ -278,7 +238,7 @@ export default {
       }).then(res => {
         if (res?.data) {
           this.detail = res.data
-          this.detail.family.map(e => {
+          this.detail.family?.map(e => {
             e.householdRelation = e.householdRelation || "户主"
           })
         }
@@ -326,46 +286,6 @@ export default {
         })
       }).catch(() => 0)
     },
-    getHelpLogs() {
-      let {id: pid} = this.detail
-      this.instance.post("/app/apppreventionreturntopovertylog/list", null, {
-        params: {size: 9999, pid}
-      }).then(res => {
-        if (res?.data) {
-          this.tableData = res.data?.records || []
-        }
-      })
-    },
-    submitHelpLog() {
-      this.$refs.DialogForm.validate(v => {
-        if (v) {
-          let {id: pid} = this.detail
-          this.instance.post(`/app/apppreventionreturntopovertylog/addOrUpdate`, {...this.form, pid}).then(res => {
-            if (res.code == 0) {
-              this.$message.success('提交成功!');
-              this.dialog = false
-              this.getHelpLogs()
-            }
-          })
-        }
-      })
-    },
-    handleEditLog(row) {
-      this.dialog = true
-      this.form = JSON.parse(JSON.stringify(row))
-    },
-    handleDeleteLog(ids) {
-      this.$confirm("是否要删除帮扶日志").then(() => {
-        this.instance.post("/app/apppreventionreturntopovertylog/delete", null, {
-          params: {ids: ids?.toString()}
-        }).then(res => {
-          if (res?.code == 0) {
-            this.$message.success("删除成功!")
-            this.getHelpLogs()
-          }
-        })
-      }).catch(() => 0)
-    },
   },
   created() {
     this.getDetail()
@@ -396,34 +316,9 @@ export default {
       }
     }
   }
-
-  .el-date-editor {
-    width: 100%;
-  }
-
-  .logItem {
-    position: relative;
-    padding: 8px 16px;
-    border-radius: 4px;
-
-    &:hover {
-      background: #eee;
-
-      .btns {
-        display: block;
-      }
-    }
-
-    .content {
-      margin: 8px 0;
-    }
-
-    .btns {
-      display: none;
-      position: absolute;
-      right: 8px;
-      bottom: 8px;
-    }
+  ::v-deep.el-tabs__content{
+    max-height: calc(100vh - 136px);
+    overflow-y: auto;
   }
 }
 </style>