新增记录
This commit is contained in:
		@@ -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>
 | 
			
		||||
 
 | 
			
		||||
@@ -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> -->
 | 
			
		||||
 
 | 
			
		||||
@@ -91,6 +91,7 @@ export default {
 | 
			
		||||
    callPhone(phone) {
 | 
			
		||||
      uni.makePhoneCall({ phoneNumber: phone })
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    previewImage(images, img) {
 | 
			
		||||
      uni.previewImage({
 | 
			
		||||
        urls: images.map((v) => v.url),
 | 
			
		||||
 
 | 
			
		||||
@@ -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),
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user