新增记录

src/apps/AppEpidemicSituation/ErrorDetail.vue

@@ -1,25 +1,286 @@
 <template>
-  <div class="ErrorDetail">ErrorDetail</div>
+  <div class="ErrorDetail">
+    <div class="top">
+      <div class="items">
+        <div class="names">李维民</div>
+        <div class="callPhones" @click="callPhone">
+          <div class="phones">15220171897</div>
+          <img src="./components/img/phone2@.png" alt="" />
+        </div>
+      </div>
+
+      <div class="card">
+        <div class="typeName">身份证号：</div>
+        <div class="idCard">4223241900****0014</div>
+        <div class="typeName1">异常情况：</div>
+
+        <div class="det">
+          <div class="detail">2020-01-13：体温38℃有咳嗽 , 未去高风险区域</div>
+          <div class="detail">2020-01-13：诊断为流感，自测38.5℃伴随咳嗽</div>
+        </div>
+      </div>
+    </div>
+
+    <div class="middle">
+      <div class="record">异常情况记录</div>
+
+      <template class="templates" v-if="data.length">
+        <div class="templatess" v-for="(item, index) in 8" :key="index">
+          <div class="cont">于2022年1月7日早上10:00自测体温38℃，家人也有咳嗽情况，初步诊断为上呼吸道感染</div>
+          <div class="bottom">
+            <div class="time">2021-12-06 13:23</div>
+            <div class="gard">
+              <span>网格员:</span>
+              <span class="gardName">李依云</span>
+            </div>
+          </div>
+        </div>
+      </template>
+
+      <AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty>
+    </div>
+
+    <div class="fixed">
+      <div class="addRecord" @click="addShow = true">新增记录</div>
+      <div class="relieveErr" @click="relieveError">解除异常</div>
+    </div>
+
+    <u-popup v-model="addShow" height="auto" mode="bottom" @close="close">
+      <scroll-view scroll-y="true" style="height: 180px" class="comments-wrapper">
+        <u-input v-model="content" placeholder="异常情况记录" type="textarea" auto-height height="150" :clearable="false" maxlength="1000"> </u-input>
+        <div class="words">字数{{ content.length }}/1000</div>
+
+        <div class="bottombtn">
+          <div class="emptys" @click="content = ''">清空内容</div>
+
+          <div class="publishs" @click="save">保存</div>
+        </div>
+      </scroll-view>
+    </u-popup>
+  </div>
 </template>
 
 <script>
+import { mapState } from 'vuex'
+
 export default {
   name: 'ErrorDetail',
   components: {},
   props: {},
   data() {
-    return {}
+    return {
+      data: [{ name: '张三' }],
+      addShow: false,
+      content: '',
+    }
+  },
+  computed: {
+    ...mapState(['user']),
   },
-  computed: {},
   watch: {},
   onLoad() {},
   onShow() {},
-  methods: {},
+  methods: {
+    close() {
+      this.content = ''
+    },
+
+    save() {
+      console.log(22)
+    },
+
+    toAddRecord() {
+      uni.navigateTo({
+        url: `./AddRecord`,
+      })
+    },
+
+    relieveError() {},
+
+    callPhone(phone) {
+      uni.makePhoneCall({ phoneNumber: phone })
+    },
+
+    previewImage(images, img) {
+      uni.previewImage({
+        urls: images.map((v) => v.url),
+        current: img,
+      })
+    },
+  },
 }
 </script>
 
 <style scoped lang="scss">
 .ErrorDetail {
-  height: 100%;
+  background: #f5f5f5;
+  padding-bottom: 142px;
+  .top {
+    padding: 32px 52px 40px 48px;
+    background: #fff;
+    .items {
+      display: flex;
+      align-items: center;
+      .names {
+        font-size: 36px;
+        font-weight: 500;
+        color: #333333;
+      }
+      .callPhones {
+        display: flex;
+        align-items: center;
+        .phones {
+          font-size: 32px;
+          font-weight: 500;
+          color: #4181ff;
+          margin-left: 60px;
+        }
+        img {
+          width: 64px;
+          height: 64px;
+          margin-left: 20px;
+        }
+      }
+    }
+
+    .card {
+      margin-top: 16px;
+      .typeName {
+        font-size: 30px;
+        color: #999999;
+      }
+      .idCard {
+        font-size: 30px;
+        color: #333333;
+        height: 42px;
+        line-height: 42px;
+      }
+      .typeName1 {
+        margin-top: 8px;
+        font-size: 30px;
+        color: #999999;
+      }
+    }
+
+    .det {
+      .detail {
+        font-size: 30px;
+        color: #333333;
+        height: 42px;
+        line-height: 42px;
+      }
+      .detail:last-child {
+        margin-top: 16px;
+      }
+    }
+  }
+
+  .middle {
+    margin-top: 24px;
+    padding-bottom: 48px;
+    background: #fff;
+    .record {
+      padding: 32px 32px;
+    }
+
+    .templatess {
+      padding: 24px 24px 18px 24px;
+      background: #f4f7fe;
+      border-radius: 8px;
+      margin: 0 32px 16px 32px;
+      .cont {
+      }
+      .bottom {
+        display: flex;
+        margin-top: 12px;
+        .time {
+          font-size: 24px;
+          color: #666666;
+        }
+        .gard {
+          font-size: 24px;
+          color: #666666;
+          margin-left: 32px;
+          .gardName {
+            display: inline;
+            margin-left: 12px;
+          }
+        }
+      }
+    }
+    .emptyWrap {
+      background: #f5f5f5;
+      margin-top: 0;
+    }
+  }
+
+  .fixed {
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    box-sizing: border-box;
+    display: flex;
+    text-align: center;
+    .addRecord {
+      width: 40%;
+      padding: 32px 0;
+      font-size: 36px;
+      color: #333333;
+      background: #fff;
+    }
+    .relieveErr {
+      width: 60%;
+      padding: 32px 0;
+      background: #1365dd;
+      font-size: 36px;
+      font-weight: 500;
+      color: #ffffff;
+    }
+  }
+
+  .comments-wrapper {
+    padding: 20px 0;
+    .u-input {
+      background: #f7f7f7;
+      border-radius: 8px 8px 0 0;
+      padding: 10px !important;
+      margin: 0 30px 0 30px;
+      .uni-textarea-placeholder {
+        padding: 16px 0 0 16px;
+      }
+      .uni-textarea-textarea {
+        padding: 16px 0 0 16px;
+      }
+    }
+    .words {
+      background: #f7f7f7;
+      border-radius: 0 0 8px 8px;
+      margin: 0 30px;
+      padding: 10px;
+      text-align: right;
+      font-size: 26px;
+      color: #999999;
+    }
+    .bottombtn {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      margin: 0 30px;
+      padding: 20px 0 0;
+      .emptys {
+        font-size: 26px;
+        color: #666666;
+      }
+      .publishs {
+        width: 144px;
+        height: 64px;
+        line-height: 64px;
+        text-align: center;
+        background: #1365dd;
+        border-radius: 32px;
+        color: #fff;
+      }
+    }
+  }
 }
 </style>

src/apps/AppEpidemicSituation/HealthDetail.vue

@@ -35,7 +35,7 @@
 
       <template>
         <!-- v-if="data.length" -->
-        <div class="templatess" v-for="(item, i) in 12" :key="i" @click="goHealthDetail()">
+        <div class="templatess" v-for="(item, i) in 12" :key="i">
           <div class="left">
             <div class="recordType recordType1">正常</div>
             <!-- <div class="recordType recordType2">异常</div> -->

src/apps/AppEpidemicSituation/UserDetail.vue

@@ -91,6 +91,7 @@ export default {
     callPhone(phone) {
       uni.makePhoneCall({ phoneNumber: phone })
     },
+
     previewImage(images, img) {
       uni.previewImage({
         urls: images.map((v) => v.url),

src/apps/AppVillageDiscuss/Detail.vue

@@ -83,9 +83,9 @@
       <div class="leftInput" @click="showBottomInput = true">我来说两句...</div>
     </div>
 
-    <u-popup v-model="showBottomInput" height="auto" mode="bottom">
+    <u-popup v-model="showBottomInput" height="auto" mode="bottom" @close="close">
       <div class="comments-wrapper">
-        <u-input v-model="content" placeholder="写下你的想法" type="textarea" auto-height height="180" maxlength="140"> </u-input>
+        <u-input v-model="content" placeholder="写下你的想法" type="textarea" auto-height :clearable="false" height="180" maxlength="140"> </u-input>
         <div class="words">字数{{ content.length }}/140</div>
 
         <div class="bottombtn">
@@ -275,6 +275,10 @@ export default {
       })
     },
 
+    close() {
+      this.content = ''
+    },
+
     previewImage(images, img) {
       uni.previewImage({
         urls: images.map((v) => v.url),