新增记录
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