ct
This commit is contained in:
shijingjing
@@ -295,11 +295,11 @@
|
||||
<h2>14天内是否接触新冠确诊或疑似患者</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<ai-radio
|
||||
<AiRadio
|
||||
style="width: 100%"
|
||||
v-model="form.touchInFourteen"
|
||||
dict="epidemicTouchInFourteen"
|
||||
></ai-radio>
|
||||
></AiRadio>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="Organization">
|
||||
<div class="title">网格人员</div>
|
||||
<div class="user-content" v-for="(item, index) in dataInfo.parentGirdMembers" :key="index" @click="viewUser(item.wxUserId)">
|
||||
<div class="user-content" v-for="(item, index) in dataInfo.parentGirdMembers" :key="index">
|
||||
<image :src="item.photo" alt="" mode="aspectFill" v-if="item.photo" />
|
||||
<img src="./components/img/big-user.png" alt="" v-else>
|
||||
<div class="right">
|
||||
@@ -10,7 +10,7 @@
|
||||
<p>{{item.girdName}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="user-content user-item" v-for="(item, index) in dataInfo.girdMembers" :key="index" @click="viewUser(item.wxUserId)">
|
||||
<div class="user-content user-item" v-for="(item, index) in dataInfo.girdMembers" :key="index">
|
||||
<image :src="item.photo" alt="" mode="aspectFill" v-if="item.photo" />
|
||||
<img src="./components/img/user-img.png" alt="" v-else />
|
||||
<div class="right">
|
||||
|
||||
@@ -1,347 +0,0 @@
|
||||
<template>
|
||||
<div class="Health">
|
||||
<AiTopFixed>
|
||||
<div class="header">
|
||||
<div class="tab-item">
|
||||
<h2 style="color: #2c51ce">{{ userList.total }}</h2>
|
||||
<p>上报人员</p>
|
||||
</div>
|
||||
<div class="tab-item">
|
||||
<h2 style="color: #5aad6a">{{ userList.today }}</h2>
|
||||
<p>今日上报</p>
|
||||
</div>
|
||||
<div class="tab-item">
|
||||
<h2 style="color: #f5a319">{{ userList.unReport }}</h2>
|
||||
<p>今日未报</p>
|
||||
</div>
|
||||
<div class="tab-item">
|
||||
<h2 style="color: #cd413a; border-right: 0">{{ userList.unusual }}</h2>
|
||||
<p>今日异常</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="line1"></div>
|
||||
|
||||
<div class="middle">
|
||||
<div class="left">
|
||||
<AiAreaPicker v-model="areaId" :areaId="user.areaId" @select="areaSelect" :name.sync="areaName" style="color: #666">
|
||||
<u-icon name="map-fill" color="#3192F4" size="20px" style="vertical-align: text-bottom"></u-icon>
|
||||
<span style="margin-left: 4px" v-if="areaName">{{ areaName }}</span>
|
||||
<span v-else>请选择</span>
|
||||
<u-icon name="arrow-down" color="#666" size="28" style="margin-left: 4px" />
|
||||
</AiAreaPicker>
|
||||
</div>
|
||||
|
||||
<u-search v-model="keyword" :clearabled="true" placeholder="请输入姓名" :show-action="false" bg-color="#F5F5F5" search-icon-color="#999" color="#999" height="58" @search="handerSearch" @clear="handerClear"></u-search>
|
||||
</div>
|
||||
|
||||
<div class="line2"></div>
|
||||
|
||||
<u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="96" bg-color="#fff" inactive-color="#333" bar-width="192" active-color="#135AB8 " @change="change"></u-tabs>
|
||||
|
||||
<div class="line3"></div>
|
||||
</AiTopFixed>
|
||||
|
||||
<div class="bottoms">
|
||||
<template v-if="data.length">
|
||||
<div class="templates" v-for="(item, i) in data" :key="i" @click="goDetail(item)">
|
||||
<img :src="item.avatar" alt="" v-if="item.avatar" />
|
||||
<img src="./components/img/user-img.png" alt="" v-else />
|
||||
|
||||
<div class="rightCont">
|
||||
<div class="rightContLeft">
|
||||
<div class="nameLeft">
|
||||
<div class="nameTop">
|
||||
<div class="names">{{ item.name }}</div>
|
||||
<div class="types" v-if="item.status == '0'">异常</div>
|
||||
</div>
|
||||
|
||||
<div class="nameBottom">
|
||||
<span>上报第</span>
|
||||
<span class="num">{{ item.diffNum }}</span>
|
||||
<span>天</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="typeRight2" v-if="item.today == '0'">今日未上报</div>
|
||||
<div class="typeRight1" v-else>今日已上报</div>
|
||||
</div>
|
||||
|
||||
<u-icon name="arrow-right" color="#ccc"></u-icon>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'Health',
|
||||
appName: '健康上报',
|
||||
components: {},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
keyword: '',
|
||||
areaId: '',
|
||||
areaName: '',
|
||||
|
||||
current: 1,
|
||||
size: 10,
|
||||
|
||||
tabList: [
|
||||
{
|
||||
name: '上报人员',
|
||||
},
|
||||
{
|
||||
name: '异常人员',
|
||||
},
|
||||
],
|
||||
currentTabs: 0,
|
||||
userList: [],
|
||||
data: [],
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState(['user']),
|
||||
},
|
||||
watch: {},
|
||||
onLoad() {
|
||||
this.areaId = this.user.areaId
|
||||
this.areaName = this.user.areaName
|
||||
this.getList()
|
||||
this.getUserList()
|
||||
|
||||
uni.$on('updateLists', () => {
|
||||
this.current = 1
|
||||
this.getList()
|
||||
this.getUserList()
|
||||
})
|
||||
},
|
||||
onShow() {
|
||||
this.areaId = this.user.areaId
|
||||
document.title = '健康上报'
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.$http
|
||||
.post('/app/appepidemicreportmember/list', null, {
|
||||
params: { size: this.size, current: this.current, status: this.currentTabs == 1 ? '0' : '', areaId: this.areaId, name: this.keyword },
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.data = this.current > 1 ? [...this.data, ...res.data.records] : res.data.records
|
||||
this.$forceUpdate()
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
this.$forceUpdate()
|
||||
})
|
||||
.finally(() => {
|
||||
this.$forceUpdate()
|
||||
})
|
||||
},
|
||||
|
||||
getUserList() {
|
||||
this.$http.post(`/app/appepidemicreportmember/statistic?areaId=${this.areaId}`).then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.userList = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
goDetail(item) {
|
||||
uni.navigateTo({
|
||||
url: `./HealthDetail?id=${item.id}&diffNum=${item.diffNum}&today=${item.today}`,
|
||||
})
|
||||
},
|
||||
|
||||
areaSelect(e) {
|
||||
this.areaId = e
|
||||
this.getList()
|
||||
this.getUserList()
|
||||
},
|
||||
|
||||
change(index) {
|
||||
this.data = []
|
||||
// this.areaId = this.user.areaId
|
||||
this.keyword = ''
|
||||
this.currentTabs = index
|
||||
this.current = 1
|
||||
this.getList()
|
||||
},
|
||||
|
||||
handerSearch(e) {
|
||||
this.keyword = e
|
||||
this.current = 1
|
||||
this.getList()
|
||||
},
|
||||
|
||||
handerClear() {
|
||||
this.keyword = ''
|
||||
this.current = 1
|
||||
this.getList()
|
||||
},
|
||||
},
|
||||
onReachBottom() {
|
||||
this.current++
|
||||
this.getList()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.Health {
|
||||
height: 100%;
|
||||
::v-deep .AiTopFixed {
|
||||
.placeholder {
|
||||
.content {
|
||||
padding: 0 !important;
|
||||
}
|
||||
}
|
||||
.fixed {
|
||||
margin: 0 !important;
|
||||
.content {
|
||||
padding: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.header {
|
||||
padding: 54px 32px 48px 32px;
|
||||
display: flex;
|
||||
background-color: #fff;
|
||||
margin-bottom: 4px;
|
||||
.tab-item {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
|
||||
h2 {
|
||||
font-size: 52px;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
height: 80px;
|
||||
margin-bottom: 8px;
|
||||
letter-spacing: -4px;
|
||||
border-right: 1px solid #ddd;
|
||||
line-height: 44px;
|
||||
}
|
||||
p {
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #999;
|
||||
line-height: 40px;
|
||||
margin-top: -22px;
|
||||
}
|
||||
}
|
||||
.tab-item:nth-last-of-type(1) {
|
||||
border-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.line1 {
|
||||
height: 4px;
|
||||
background: #f5f5f5;
|
||||
}
|
||||
|
||||
.middle {
|
||||
display: flex;
|
||||
padding: 24px 32px;
|
||||
.left {
|
||||
width: 40%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
img {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
}
|
||||
}
|
||||
.u-search {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.line2 {
|
||||
height: 8px;
|
||||
background: #f5f5f5;
|
||||
}
|
||||
|
||||
.line3 {
|
||||
height: 6px;
|
||||
background: #f5f5f5;
|
||||
}
|
||||
|
||||
.bottoms {
|
||||
.templates {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 32px;
|
||||
box-shadow: inset 0px -1px 0px 0px #dddddd;
|
||||
background: #fff;
|
||||
img {
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
// border-radius: 50%;
|
||||
// border: 1px solid #cccccc;
|
||||
}
|
||||
.rightCont {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-left: 32px;
|
||||
width: 100%;
|
||||
.rightContLeft {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
.nameLeft {
|
||||
.nameTop {
|
||||
display: flex;
|
||||
.names {
|
||||
font-size: 32px;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
.types {
|
||||
margin-left: 16px;
|
||||
padding: 4px 16px 8px 16px;
|
||||
background: #faeceb;
|
||||
border-radius: 20px;
|
||||
font-size: 24px;
|
||||
color: #cd413a;
|
||||
}
|
||||
}
|
||||
.nameBottom {
|
||||
margin-top: 12px;
|
||||
font-size: 28px;
|
||||
color: #999999;
|
||||
.num {
|
||||
color: #135ab8;
|
||||
}
|
||||
}
|
||||
}
|
||||
.typeRight1 {
|
||||
font-size: 28px;
|
||||
color: #999999;
|
||||
}
|
||||
.typeRight2 {
|
||||
font-size: 28px;
|
||||
color: #f5a319;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.emptyWrap {
|
||||
margin-top: 0;
|
||||
background: #f5f5f5;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,365 +0,0 @@
|
||||
<template>
|
||||
<div class="ErrorDetail">
|
||||
<div class="header">
|
||||
<div class="name">
|
||||
{{ userList.name }}<span>{{ userList.phone }}</span
|
||||
><img :src="$cdn + 'common/phone.png'" alt="" @click="callPhone(userList.phone)" class="phone-icon" />
|
||||
</div>
|
||||
<p>身份证号：</p>
|
||||
<p class="mar-b8" style="color: #333">{{ userList.idNumber && userList.idNumber.replace(/^(\w{6})\w{8}(.*)$/, '$1********$2') }}</p>
|
||||
<p>异常情况：</p>
|
||||
<div v-if="datas.length">
|
||||
<div v-for="(item, index) in datas" :key="index" style="color: #ff4466">
|
||||
<span style="color: #666" v-if="item.status == 0">{{ item.checkTime && item.checkTime.substring(0, 10) }}:</span>
|
||||
|
||||
<div v-if="item.temperature * 1 >= 37.3">
|
||||
<span>当前体温</span>
|
||||
|
||||
<span style="margin-left: 10px">{{ item.temperature }}℃</span>
|
||||
</div>
|
||||
|
||||
<div v-if="item.touchInFourteen * 1 !== 0">
|
||||
<span>14天内是否接触新冠确诊或疑似患者</span>
|
||||
|
||||
<span style="margin-left: 10px">
|
||||
{{ $dict.getLabel('epidemicTouchInFourteen', item.touchInFourteen) }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div v-if="item.health !== '0'">
|
||||
<span>当前健康状况</span>
|
||||
|
||||
<div class="healths">
|
||||
<span v-for="(items, index) in item.health && item.health.split(',')" :key="index">
|
||||
<span v-if="index > 0"> ; </span>
|
||||
<span>
|
||||
{{ $dict.getLabel('epidemicRecentHealth', items) }}
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="item.checkResult != 0">
|
||||
<span>核酸检测结果</span>
|
||||
|
||||
<span style="margin-left: 10px">
|
||||
{{ $dict.getLabel('epidemicRecentTestResult', item.checkResult) }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div v-if="item.healthCode == 2 || item.healthCode == 3 || item.healthCode == 4">
|
||||
<span>健康码</span>
|
||||
|
||||
<span style="margin-left: 10px">
|
||||
{{ $dict.getLabel('epidemicHealthCode', item.healthCode) }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p style="color: #333" v-else>暂无异常情况</p>
|
||||
</div>
|
||||
|
||||
<div class="info" v-if="data.length">
|
||||
<div class="title">异常情况记录</div>
|
||||
<div class="error-list" v-if="data.length">
|
||||
<div class="itemes" v-for="(item, i) in data" :key="i">
|
||||
<p>{{ item.content }}</p>
|
||||
<div>
|
||||
<span>{{ item.createTime }}</span>
|
||||
<span class="names">{{ item.createUserName }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty>
|
||||
</div>
|
||||
|
||||
<!-- <div class="bg-line"></div> -->
|
||||
|
||||
<div class="footer">
|
||||
<div class="add" @click="show = true">新增记录</div>
|
||||
<div class="confirm" @click="cancel">解除异常</div>
|
||||
</div>
|
||||
|
||||
<u-popup v-model="show" mode="bottom">
|
||||
<div class="textarea">
|
||||
<u-input v-model="value" type="textarea" :height="120" :auto-height="true" placeholder="异常情况记录" :clearable="false" maxlength="1000" />
|
||||
<p>字数{{ value.length }}/1000</p>
|
||||
</div>
|
||||
<div class="btn">
|
||||
<span @click="value = ''">清空内容</span>
|
||||
<span class="confirm" @click="confirm">保存</span>
|
||||
</div>
|
||||
</u-popup>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex'
|
||||
|
||||
export default {
|
||||
components: {},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
value: '',
|
||||
userList: [],
|
||||
data: [],
|
||||
datas: [],
|
||||
size: 10,
|
||||
current: 1,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState(['user']),
|
||||
},
|
||||
onLoad(o) {
|
||||
console.log(o)
|
||||
this.$dict.load('epidemicMemberType', 'epidemicRecentTravel', 'epidemicTouchInFourteen', 'epidemicRecentTestResult', 'epidemicRecentHealth', 'epidemicHealthCode').then(() => {
|
||||
if (o) {
|
||||
this.id = o.id
|
||||
this.getUser()
|
||||
this.getRecord()
|
||||
this.getErrThing()
|
||||
}
|
||||
})
|
||||
},
|
||||
onShow() {
|
||||
document.title = '异常情况处理'
|
||||
},
|
||||
methods: {
|
||||
getUser() {
|
||||
this.$http.post(`/app/appepidemicreportmember/queryDetailById?id=${this.id}`).then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.userList = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 异常情况
|
||||
getErrThing() {
|
||||
this.$http.post(`/app/appepidemichealthreport/list?memberId=${this.id}`).then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.datas = res.data.records
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 异常情况记录
|
||||
getRecord() {
|
||||
this.$http
|
||||
.post(`/app/appepidemicunusuallog/list`, null, {
|
||||
params: {
|
||||
recordId: this.id,
|
||||
size: this.size,
|
||||
current: this.current,
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.data = this.current > 1 ? [...this.data, ...res.data.records] : res.data.records
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 新增记录
|
||||
confirm() {
|
||||
if (!this.value) {
|
||||
return this.$u.toast('请输入异常情况')
|
||||
}
|
||||
|
||||
var params = {
|
||||
content: this.value,
|
||||
createUserId: this.user.id,
|
||||
createUserName: this.user.name,
|
||||
recordId: this.id,
|
||||
}
|
||||
this.$http.post('/app/appepidemicunusuallog/addOrUpdate', params).then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.$u.toast('新增成功!')
|
||||
this.show = false
|
||||
this.value = ''
|
||||
this.getUser()
|
||||
this.getRecord()
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
cancel() {
|
||||
this.$confirm(`是否解除该条异常信息？`).then(() => {
|
||||
this.$http.post('/app/appepidemicreportmember/release', { id: this.id }).then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.$u.toast('解除成功!')
|
||||
uni.$emit('updateDetails')
|
||||
uni.$emit('updateLists')
|
||||
setTimeout(() => {
|
||||
uni.navigateBack()
|
||||
}, 600)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
callPhone(phone) {
|
||||
uni.makePhoneCall({ phoneNumber: phone })
|
||||
},
|
||||
},
|
||||
onReachBottom() {
|
||||
this.current++
|
||||
this.getRecord()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.ErrorDetail {
|
||||
height: 100%;
|
||||
.header {
|
||||
padding: 32px 48px;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
margin-bottom: 24px;
|
||||
.name {
|
||||
font-size: 36px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
line-height: 50px;
|
||||
margin-bottom: 16px;
|
||||
span {
|
||||
font-size: 32px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #4181ff;
|
||||
line-height: 44px;
|
||||
margin: 0 20px 0 32px;
|
||||
}
|
||||
img {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
p {
|
||||
font-size: 30px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #999;
|
||||
line-height: 42px;
|
||||
color: #999;
|
||||
}
|
||||
.mar-b8 {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
}
|
||||
.info {
|
||||
padding-bottom: 112px;
|
||||
.title {
|
||||
padding: 0 32px;
|
||||
font-size: 38px;
|
||||
font-family: PingFangSC-Semibold, PingFang SC;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
line-height: 116px;
|
||||
background-color: #fff;
|
||||
}
|
||||
.error-list {
|
||||
background-color: #fff !important;
|
||||
padding-bottom: 24px;
|
||||
.itemes {
|
||||
margin: 0 32px;
|
||||
background: #f4f7fe;
|
||||
border-radius: 8px;
|
||||
padding: 24px 24px 18px 24px;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 16px;
|
||||
|
||||
span {
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #343d65;
|
||||
line-height: 40px;
|
||||
word-break: break-all;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
div {
|
||||
font-size: 24px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #666;
|
||||
line-height: 34px;
|
||||
span:last-child {
|
||||
display: inline-block;
|
||||
margin-left: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.footer {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 112px;
|
||||
line-height: 112px;
|
||||
background: #fff;
|
||||
display: flex;
|
||||
font-size: 36px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
.add {
|
||||
flex: 1;
|
||||
color: #333;
|
||||
}
|
||||
.confirm {
|
||||
flex: 2;
|
||||
color: #fff;
|
||||
background: #1365dd;
|
||||
}
|
||||
div {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.bg-line {
|
||||
width: 100%;
|
||||
height: 130px;
|
||||
}
|
||||
.textarea {
|
||||
margin: 32px 32px 24px;
|
||||
width: calc(100% - 64px);
|
||||
padding: 16px;
|
||||
box-sizing: border-box;
|
||||
background: #f7f7f7;
|
||||
border-radius: 8px;
|
||||
p {
|
||||
font-size: 26px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #999;
|
||||
line-height: 36px;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
padding: 0 32px 24px;
|
||||
height: 64px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
span {
|
||||
display: inline-block;
|
||||
line-height: 64px;
|
||||
font-size: 26px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #666;
|
||||
}
|
||||
.confirm {
|
||||
width: 144px;
|
||||
text-align: center;
|
||||
background: #1365dd;
|
||||
border-radius: 32px;
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,269 +0,0 @@
|
||||
<template>
|
||||
<div class="HealthDetail">
|
||||
<div class="top">
|
||||
<div class="templates">
|
||||
<img :src="userList.avatar" alt="" v-if="userList.avatar" />
|
||||
<img src="./components/img/user-img.png" alt="" v-else />
|
||||
|
||||
<div class="rightCont">
|
||||
<div class="rightContLeft">
|
||||
<div class="nameLeft">
|
||||
<div class="nameTop">
|
||||
<div class="names">{{ userList.name }}</div>
|
||||
<div class="types" v-if="userList.status == '0'">异常</div>
|
||||
</div>
|
||||
|
||||
<div class="nameBottom">
|
||||
<span>上报第</span>
|
||||
<span class="num">{{ diffNum }}</span>
|
||||
<span>天</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="rightContRight" @click.stop="callPhone(userList.phone)">
|
||||
<img src="./components/img/phone2@.png" alt="" />
|
||||
<span class="call">拨打电话</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="middle">
|
||||
<div class="record">异常情况记录</div>
|
||||
|
||||
<template v-if="data.length">
|
||||
<div class="templatess" v-for="(item, i) in data" :key="i" @click="toUserDetail(item)">
|
||||
<div class="left">
|
||||
<div class="recordType recordType1" v-if="item.status == 1">正常</div>
|
||||
<div class="recordType recordType2" v-if="item.status == 0">异常</div>
|
||||
</div>
|
||||
|
||||
<div class="right">
|
||||
<div class="times">{{ item.createTime }}</div>
|
||||
<u-icon name="arrow-right" color="#CCCCCC"></u-icon>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty>
|
||||
</div>
|
||||
|
||||
<div class="fixedBtn" @click="toErr" v-if="userList.status == '0' && today == '1'">异常情况处理</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'HealthDetail',
|
||||
components: {},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
data: [],
|
||||
id: '',
|
||||
name: '',
|
||||
userList: [],
|
||||
diffNum: '',
|
||||
today: '',
|
||||
size: 10,
|
||||
current: 1,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState(['user']),
|
||||
},
|
||||
watch: {},
|
||||
onLoad(o) {
|
||||
console.log(o)
|
||||
if (o.id) {
|
||||
this.name = o.name
|
||||
this.id = o.id
|
||||
this.phone = o.phone
|
||||
this.diffNum = o.diffNum
|
||||
this.today = o.today
|
||||
this.getUser()
|
||||
}
|
||||
this.getRecord()
|
||||
|
||||
uni.$on('updateDetails', () => {
|
||||
this.getUser()
|
||||
this.getRecord()
|
||||
})
|
||||
},
|
||||
onShow() {
|
||||
document.title = '健康上报'
|
||||
},
|
||||
methods: {
|
||||
getUser() {
|
||||
this.$http.post(`/app/appepidemicreportmember/queryDetailById?id=${this.id}`).then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.userList = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
getRecord() {
|
||||
this.$http
|
||||
.post(`/app/appepidemichealthreport/list`, null, {
|
||||
params: {
|
||||
memberId: this.id,
|
||||
size: this.size,
|
||||
current: this.current,
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.data = this.current > 1 ? [...this.data, ...res.data.records] : res.data.records
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
callPhone(phone) {
|
||||
uni.makePhoneCall({ phoneNumber: phone })
|
||||
},
|
||||
|
||||
toUserDetail(item) {
|
||||
uni.navigateTo({
|
||||
url: `./UserDetail?id=${item.id}&temperature=${item.temperature}&touchInFourteen=${item.touchInFourteen}&health=${item.health}&checkTime=${item.checkTime}&checkResult=${item.checkResult}&checkPhoto=${item.checkPhoto}&status=${item.status}&memberId=${this.id}&vaccine=${item.vaccine}&healthCode=${item.healthCode}&releaseName=${this.userList.releaseName ? this.userList.releaseName : ''}&releaseTime=${this.userList.releaseTime ? this.userList.releaseTime : ''}&statuses=${this.userList.status}`,
|
||||
})
|
||||
},
|
||||
|
||||
toErr() {
|
||||
uni.navigateTo({
|
||||
url: `./ErrorDetail?id=${this.id}`,
|
||||
})
|
||||
},
|
||||
},
|
||||
onReachBottom() {
|
||||
this.current++
|
||||
this.getRecord()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
uni-page-body {
|
||||
height: 100%;
|
||||
}
|
||||
.HealthDetail {
|
||||
height: 100%;
|
||||
background: #f5f5f5 !important;
|
||||
.top {
|
||||
.templates {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 32px;
|
||||
box-shadow: inset 0px -1px 0px 0px #dddddd;
|
||||
background: #fff;
|
||||
img {
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
// border-radius: 50%;
|
||||
// border: 1px solid #cccccc;
|
||||
}
|
||||
.rightCont {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-left: 32px;
|
||||
width: 100%;
|
||||
.rightContLeft {
|
||||
// display: flex;
|
||||
// justify-content: space-between;
|
||||
// align-items: center;
|
||||
// width: 100%;
|
||||
.nameLeft {
|
||||
.nameTop {
|
||||
display: flex;
|
||||
.names {
|
||||
font-size: 32px;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
.types {
|
||||
margin-left: 16px;
|
||||
padding: 4px 16px 8px 16px;
|
||||
background: #faeceb;
|
||||
border-radius: 20px;
|
||||
font-size: 24px;
|
||||
color: #cd413a;
|
||||
}
|
||||
}
|
||||
.nameBottom {
|
||||
margin-top: 12px;
|
||||
font-size: 28px;
|
||||
color: #999999;
|
||||
.num {
|
||||
color: #135ab8;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.rightContRight {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 25%;
|
||||
img {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
}
|
||||
.call {
|
||||
font-size: 24px;
|
||||
color: #3d94fb;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.middle {
|
||||
margin-top: 16px;
|
||||
background: #fff;
|
||||
.record {
|
||||
padding: 26px 0 26px 32px;
|
||||
box-shadow: inset 0px -1px 0px 0px #dddddd;
|
||||
}
|
||||
.templatess {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 28px 32px;
|
||||
box-shadow: inset 0px -1px 0px 0px #dddddd;
|
||||
.left,
|
||||
.right {
|
||||
display: flex;
|
||||
.recordType {
|
||||
font-size: 28px;
|
||||
font-weight: 500;
|
||||
}
|
||||
.recordType1 {
|
||||
color: #5aad6a;
|
||||
}
|
||||
.recordType2 {
|
||||
color: #cd413a;
|
||||
}
|
||||
}
|
||||
}
|
||||
.emptyWrap {
|
||||
background: #f5f5f5;
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.fixedBtn {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
padding: 34px 0;
|
||||
text-align: center;
|
||||
background: #1365dd;
|
||||
box-sizing: border-box;
|
||||
font-size: 32px;
|
||||
font-weight: 500;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,310 +0,0 @@
|
||||
<template>
|
||||
<div class="UserDetail">
|
||||
<div class="info">
|
||||
<div class="title">基本信息</div>
|
||||
<div class="item-flex">
|
||||
<div class="label">姓名</div>
|
||||
<div class="value">{{ data.name }}</div>
|
||||
</div>
|
||||
<div class="item-flex">
|
||||
<div class="label">身份证号</div>
|
||||
<div class="value">{{ data.idNumber }}</div>
|
||||
</div>
|
||||
<div class="item-flex">
|
||||
<div class="label">联系方式</div>
|
||||
<div class="value" style="color: #4181ff">
|
||||
<img :src="$cdn + 'common/phone.png'" alt="" @click="callPhone(data.phone)" class="phone-icon" />
|
||||
{{ data.phone }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="item-flex">
|
||||
<div class="label">本地地区</div>
|
||||
<div class="value">{{ data.areaName }}</div>
|
||||
</div>
|
||||
|
||||
<div class="item-flex">
|
||||
<div class="label">本地地址</div>
|
||||
<div class="value">{{ data.address }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="line-bg"></div>
|
||||
<div class="info">
|
||||
<div class="title">健康状况</div>
|
||||
<div class="item-flex">
|
||||
<div class="label">当前体温</div>
|
||||
<div class="value temperature" :style="{ color: userList.temperature * 1 >= 37.3 ? '#FF4466' : '#42D784' }">{{ userList.temperature }}℃</div>
|
||||
</div>
|
||||
<div class="item-flex">
|
||||
<div class="label" style="width: 360px">14天内是否接触新冠确诊或疑似患者</div>
|
||||
<div class="value" :style="userList.touchInFourteen == 0 ? 'color:#42D784;' : userList.touchInFourteen == 1 ? 'color:#FF4466' : 'color:#4181FF'">{{ $dict.getLabel('epidemicTouchInFourteen', userList.touchInFourteen) }}</div>
|
||||
</div>
|
||||
<div class="item-flexs">
|
||||
<div class="label">当前健康状况</div>
|
||||
<div class="healths">
|
||||
<span v-for="(item, index) in userList.health" :key="index" :style="item != 0 ? 'color:#FF4466;' : ''">
|
||||
<span v-if="index > 0"> ; </span>
|
||||
<span>
|
||||
{{ $dict.getLabel('epidemicRecentHealth', item) }}
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="line-bg"></div>
|
||||
<div class="info">
|
||||
<div class="title">核酸检测信息</div>
|
||||
<div class="item-flex">
|
||||
<div class="label">核酸检测日期</div>
|
||||
<div class="value">{{ userList.checkTime && userList.checkTime.substring(0, 10) }}</div>
|
||||
</div>
|
||||
|
||||
<div class="item-flex">
|
||||
<div class="label">核酸检测结果</div>
|
||||
<div class="value" :style="userList.checkResult == 1 ? 'color:#f46;' : 'color:#42D784;'">{{ $dict.getLabel('epidemicRecentTestResult', userList.checkResult) }}</div>
|
||||
</div>
|
||||
|
||||
<div class="item-flex">
|
||||
<div class="label">健康码</div>
|
||||
<div class="value" :style="{ color: userList.healthCode == '0' || userList.healthCode == '1' ? '#42D784' : '#FF4466' }">{{ $dict.getLabel('epidemicHealthCode', userList.healthCode) }}</div>
|
||||
</div>
|
||||
|
||||
<div class="item-flex">
|
||||
<div class="label">已接种试剂</div>
|
||||
<div class="value">{{ userList.vaccine }}次</div>
|
||||
</div>
|
||||
|
||||
<div class="item-flex checkPhotos">
|
||||
<div style="color: #999">本人健康码截图或核酸检测报告</div>
|
||||
</div>
|
||||
<div class="img-list">
|
||||
<img :src="item.url" alt="" v-for="(item, index) in userList.checkPhoto" :key="index" @click="previewImage(userList.checkPhoto, item.url)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="line-bg" v-if="userList.status == 0 && userList.statuses == 1"></div>
|
||||
<div class="info" v-if="userList.status == 0 && userList.statuses == 1">
|
||||
<div class="title">异常处理情况</div>
|
||||
|
||||
<div class="item-record">
|
||||
<div class="label">异常情况记录</div>
|
||||
<div class="error-list" v-if="datas.length">
|
||||
<div class="records" v-for="(item, index) in datas" :key="index">
|
||||
<p>{{ item.content }}</p>
|
||||
|
||||
<div>
|
||||
<span>{{ item.createTime }}</span>
|
||||
<span class="names">{{ item.createUserName }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty>
|
||||
</div>
|
||||
|
||||
<div class="item-flex">
|
||||
<div class="label">异常解除人</div>
|
||||
<div class="value">{{ userList.releaseName }}</div>
|
||||
</div>
|
||||
|
||||
<div class="item-flex">
|
||||
<div class="label">异常解除时间</div>
|
||||
<div class="value">{{ userList.releaseTime && userList.releaseTime.substring(0, 10) }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="line-bg"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'UserDetail',
|
||||
components: {},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
id: '',
|
||||
userList: {},
|
||||
data: [],
|
||||
datas: [],
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState(['user']),
|
||||
},
|
||||
onLoad(o) {
|
||||
console.log(o)
|
||||
this.$dict.load('epidemicMemberType', 'epidemicRecentTravel', 'epidemicTouchInFourteen', 'epidemicRecentTestResult', 'epidemicRecentHealth', 'epidemicHealthCode').then(() => {
|
||||
this.id = o.id
|
||||
this.userList = o
|
||||
this.userList.checkPhoto = JSON.parse(o.checkPhoto)
|
||||
this.userList.health = o.health.split(',')
|
||||
|
||||
this.userList.releaseName = o.releaseName
|
||||
this.getUser()
|
||||
if (this.userList.releaseName) {
|
||||
this.getRecord()
|
||||
}
|
||||
})
|
||||
},
|
||||
onShow() {
|
||||
document.title = '健康上报'
|
||||
},
|
||||
methods: {
|
||||
getUser() {
|
||||
this.$http.post(`/app/appepidemicreportmember/queryDetailById?id=${this.userList.memberId}`).then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.data = res.data
|
||||
this.data.idNumber = res.data.idNumber.replace(/(.{6}).*(.{4})/, '$1********$2')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 异常情况记录
|
||||
getRecord() {
|
||||
this.$http.post(`/app/appepidemicunusuallog/list?recordId=${this.userList.memberId}`).then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.datas = res.data.records
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
callPhone(phone) {
|
||||
uni.makePhoneCall({ phoneNumber: phone })
|
||||
},
|
||||
|
||||
previewImage(images, img) {
|
||||
uni.previewImage({
|
||||
urls: images.map((v) => v.url),
|
||||
current: img,
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.UserDetail {
|
||||
background: #f3f6f9;
|
||||
.info {
|
||||
background-color: #fff;
|
||||
padding: 0 32px;
|
||||
.title {
|
||||
line-height: 116px;
|
||||
background: #fff;
|
||||
font-size: 38px;
|
||||
font-family: PingFangSC-Semibold, PingFang SC;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
}
|
||||
.item-flex {
|
||||
padding: 34px 0;
|
||||
border-bottom: 1px solid #ddd;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
line-height: 44px;
|
||||
font-size: 32px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
.label {
|
||||
width: 206px;
|
||||
color: #999;
|
||||
}
|
||||
.value {
|
||||
width: calc(100% - 206px);
|
||||
word-break: break-all;
|
||||
color: #333;
|
||||
text-align: right;
|
||||
.phone-icon {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
vertical-align: middle;
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.checkPhotos {
|
||||
border-bottom: none !important;
|
||||
}
|
||||
.error-list {
|
||||
background-color: #fff !important;
|
||||
padding-bottom: 24px;
|
||||
margin-top: 10px;
|
||||
border-bottom: 1px solid #ddd;
|
||||
.records {
|
||||
background: #f4f7fe;
|
||||
border-radius: 8px;
|
||||
padding: 24px 24px 18px 24px;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 16px;
|
||||
|
||||
p {
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #343d65;
|
||||
line-height: 40px;
|
||||
word-break: break-all;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
div {
|
||||
font-size: 24px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #666;
|
||||
line-height: 34px;
|
||||
span:last-child {
|
||||
display: inline-block;
|
||||
margin-left: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.item-flexs {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 34px 0;
|
||||
border-bottom: 1px solid #ddd;
|
||||
font-size: 32px;
|
||||
.label {
|
||||
width: 32%;
|
||||
color: #999;
|
||||
}
|
||||
.healths {
|
||||
width: 68%;
|
||||
word-break: break-all;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
.img-list {
|
||||
padding-bottom: 48px;
|
||||
img {
|
||||
width: 320px;
|
||||
height: 320px;
|
||||
}
|
||||
}
|
||||
.item-flex:nth-last-of-type(1) {
|
||||
border-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.line-bg {
|
||||
width: 100%;
|
||||
height: 24px;
|
||||
background-color: #f3f6f9;
|
||||
}
|
||||
.footer {
|
||||
width: 100%;
|
||||
height: 112px;
|
||||
line-height: 112px;
|
||||
background: #1365dd;
|
||||
box-shadow: inset 0px 1px 0px 0px #eeeeee;
|
||||
font-size: 32px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 282 B |
Binary file not shown.
|
Before Width: | Height: | Size: 36 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 161 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 48 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 277 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 978 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.7 KiB |
534
src/sass/AppHealthUp/AppHealthUp.vue
Normal file
534
src/sass/AppHealthUp/AppHealthUp.vue
Normal file
@@ -0,0 +1,534 @@
|
||||
<template>
|
||||
<div class="AppHealthUp">
|
||||
<AiTopFixed>
|
||||
<u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="96" @change="change"
|
||||
:bar-width="48" :bar-height="4" active-color="#fff" bg-color="#3975C6" inactive-color="#CDDCF0"></u-tabs>
|
||||
</AiTopFixed>
|
||||
<div v-if="currentTabs != 1">
|
||||
<div v-if="!isUpload">
|
||||
<div class="form-item__group">
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>姓名</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<input placeholder="请输入" v-model="form.name" :maxlength="20" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item__group">
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>当前体温</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<input
|
||||
placeholder="请输入"
|
||||
v-model="form.temperature"
|
||||
:maxlength="20"
|
||||
/>
|
||||
<i>℃</i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item form-item__imgs">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>14天内是否接触新冠确诊或疑似患者</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<AiRadio
|
||||
style="width: 100%"
|
||||
v-model="form.touchInFourteen"
|
||||
dict="epidemicTouchInFourteen"
|
||||
></AiRadio>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item form-item__imgs">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>当前健康状况（可多选）</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<AiCheckbox
|
||||
style="width: 100%"
|
||||
v-model="form.health"
|
||||
dict="epidemicRecentHealth"
|
||||
></AiCheckbox>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pad-b112"></div>
|
||||
</div>
|
||||
<AiEmpty v-else :noPermit="true" description="今日已上报"></AiEmpty>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div class="form-item__group">
|
||||
<div class="group_title">基本信息</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<span class="label">姓名</span>
|
||||
</div>
|
||||
<div class="form-item__right">张三</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="time-content">
|
||||
<div class="title">上报记录<span>(12月)</span></div>
|
||||
<div class="time">
|
||||
<div class="week-list">
|
||||
<span v-for="(item, index) in weekList" :key="index">{{item}}</span>
|
||||
</div>
|
||||
<div class="day-list">
|
||||
<div v-for="(item, index) in 30" :key="index" class="item" :class="index == 7 ? 'active' : ''">
|
||||
<div class="num">{{item}}</div>
|
||||
<span class="status"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item__group">
|
||||
<div class="group_title">健康状况</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<span class="label">当前体温</span>
|
||||
</div>
|
||||
<div class="form-item__right">36.2℃</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<span class="label" style="width:190px;">14天内是否接触新冠确诊或疑似患者</span>
|
||||
</div>
|
||||
<div class="form-item__right">否</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<span class="label">当前健康状况</span>
|
||||
</div>
|
||||
<div class="form-item__right">感冒症状;乏力、咳嗽、发烧、肌肉痛、头痛</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pad-b112"></div>
|
||||
</div>
|
||||
|
||||
<div class="add-btn" v-if="!isUpload && currentTabs != 1">
|
||||
<div>提交</div>
|
||||
</div>
|
||||
<div class="add-btn" v-if="currentTabs == 1" @click="toOther">
|
||||
<div>查看其他成员</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'AppHealthUp',
|
||||
appName: '健康上报',
|
||||
data() {
|
||||
return {
|
||||
tabList: [{ name: '健康上报'},{ name: '上报统计'}],
|
||||
currentTabs: 1,
|
||||
form: {},
|
||||
isUpload: false,
|
||||
weekList: ['一', '二', '三', '四', '五', '六', '日']
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState(['user']),
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
},
|
||||
onShow() {
|
||||
document.title = '健康上报'
|
||||
},
|
||||
methods: {
|
||||
change(index) {
|
||||
this.currentTabs = index
|
||||
},
|
||||
toOther() {
|
||||
uni.navigateTo({ url: './OtherUser'})
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
uni-page-body {
|
||||
height: 100%;
|
||||
}
|
||||
.AppHealthUp {
|
||||
|
||||
.emptyWrap {
|
||||
background: #f5f5f5;
|
||||
margin: 0;
|
||||
}
|
||||
::v-deep .emptyText{
|
||||
text-align: center;
|
||||
}
|
||||
.add-btn{
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 999;
|
||||
width: 100%;
|
||||
height: 112px;
|
||||
line-height: 112px;
|
||||
background: #3975C6;
|
||||
font-size: 32px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #FFF;
|
||||
div{
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .u-tab-bar{
|
||||
bottom: 14px;
|
||||
}
|
||||
|
||||
.form-item__group {
|
||||
margin-bottom: 24px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
padding-left: 32px;
|
||||
|
||||
.form-item__checkbox {
|
||||
width: 100%;
|
||||
div {
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
margin-bottom: 24px;
|
||||
text-align: center;
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
color: #333333;
|
||||
font-size: 28px;
|
||||
border: 1px solid #cccccc;
|
||||
|
||||
&.active {
|
||||
background: #4181ff;
|
||||
color: #fff;
|
||||
border-color: #4181ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.form-item__radio {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
|
||||
div {
|
||||
width: 212px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
margin-right: 16px;
|
||||
margin-bottom: 8px;
|
||||
text-align: center;
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
color: #333333;
|
||||
font-size: 28px;
|
||||
border: 1px solid #cccccc;
|
||||
|
||||
&:nth-of-type(3n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
&.active {
|
||||
background: #4181ff;
|
||||
color: #fff;
|
||||
border-color: #4181ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ai-area__wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 100px;
|
||||
|
||||
span {
|
||||
color: #333;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
i {
|
||||
color: #999;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 16px;
|
||||
height: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.form-item__wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 128px;
|
||||
padding-right: 28px;
|
||||
border-bottom: 1px solid #dddddd;
|
||||
|
||||
input {
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
text-align: right;
|
||||
color: #333;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.form-item__right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 32px;
|
||||
|
||||
.select {
|
||||
._i {
|
||||
padding-left: 100px;
|
||||
}
|
||||
}
|
||||
|
||||
span {
|
||||
max-width: 400px;
|
||||
margin-right: 8px;
|
||||
color: #333333;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
i {
|
||||
margin-right: 8px;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
.form-item__wrapper {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
.form-item__title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
i {
|
||||
font-size: 32px;
|
||||
color: #ff4466;
|
||||
}
|
||||
|
||||
span {
|
||||
font-size: 28px;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
h2 {
|
||||
padding: 0 4px;
|
||||
font-weight: 600;
|
||||
font-size: 32px;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
&.form-item__imgs,
|
||||
&.form-item__textarea {
|
||||
.form-item__wrapper {
|
||||
display: block;
|
||||
height: auto;
|
||||
padding-bottom: 32px;
|
||||
}
|
||||
|
||||
textarea {
|
||||
width: 100%;
|
||||
height: 90px;
|
||||
}
|
||||
|
||||
.form-item__title {
|
||||
padding: 32px 0;
|
||||
}
|
||||
|
||||
.form-item__right {
|
||||
padding-left: 18px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn-wrapper {
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
z-index: 11;
|
||||
width: 100%;
|
||||
padding: 20px 0 20px 0 !important;
|
||||
transform: translateX(-50%);
|
||||
background: #f3f6f9;
|
||||
}
|
||||
|
||||
.btn-wrapper .btn {
|
||||
width: 686px;
|
||||
height: 88px;
|
||||
line-height: 88px;
|
||||
margin: 0 auto;
|
||||
padding: 0 !important;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-size: 34px;
|
||||
background: #4181FF;
|
||||
border-radius: 16px;
|
||||
}
|
||||
|
||||
.btn-wrapper .disabled {
|
||||
color: #B9E7D0;
|
||||
background: #50C48A;
|
||||
}
|
||||
|
||||
::v-deep .AiTopFixed {
|
||||
.placeholder {
|
||||
.content {
|
||||
padding: 0 !important;
|
||||
|
||||
}
|
||||
}
|
||||
.fixed {
|
||||
margin: 0 !important;
|
||||
background-color: #f5f5f5!important;
|
||||
.content {
|
||||
padding: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.label{
|
||||
width: 280px;
|
||||
font-size: 32px!important;
|
||||
}
|
||||
.group_title{
|
||||
width: 100%;
|
||||
height: 116px;
|
||||
line-height: 116px;
|
||||
background: #FFF;
|
||||
padding-left: 32px;
|
||||
font-size: 38px;
|
||||
font-family: PingFangSC-Semibold, PingFang SC;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
}
|
||||
.time-content{
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
.title{
|
||||
line-height: 96px;
|
||||
padding-left: 32px;
|
||||
font-size: 36px;
|
||||
font-family: PingFang-SC-Bold, PingFang-SC;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
span{
|
||||
display: inline-block;
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
font-size: 26px;
|
||||
font-family: PingFang-SC-Heavy, PingFang-SC;
|
||||
color: #666;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
.time{
|
||||
padding: 0 32px 32px;
|
||||
background-color: #fff;
|
||||
margin-bottom: 24px;
|
||||
.week-list{
|
||||
span{
|
||||
display: inline-block;
|
||||
width: 98px;
|
||||
text-align: center;
|
||||
padding: 32px 0;
|
||||
font-size: 20px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
.day-list{
|
||||
.item{
|
||||
display: inline-block;
|
||||
width: 98px;
|
||||
height: 98px;
|
||||
text-align: center;
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
position: relative;
|
||||
.num{
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.status{
|
||||
position: absolute;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
top: 60px;
|
||||
left: 50%;
|
||||
margin-left: -4px;
|
||||
background: #3B87F6;
|
||||
}
|
||||
.status0{
|
||||
background: #999;
|
||||
}
|
||||
.status1{
|
||||
background: #3B87F6;
|
||||
}
|
||||
.status2{
|
||||
background: #f46;
|
||||
}
|
||||
}
|
||||
.active{
|
||||
.num{
|
||||
background: #3B87F6;
|
||||
color: #fff;
|
||||
}
|
||||
.status{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.pad-b112{
|
||||
padding-bottom: 112px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
449
src/sass/AppHealthUp/OtherStatistics.vue
Normal file
449
src/sass/AppHealthUp/OtherStatistics.vue
Normal file
@@ -0,0 +1,449 @@
|
||||
<template>
|
||||
<div class="OtherStatistics">
|
||||
<div class="form-item__group">
|
||||
<div class="group_title">基本信息</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<span class="label">姓名</span>
|
||||
</div>
|
||||
<div class="form-item__right">张三</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="time-content">
|
||||
<div class="title">上报记录<span>(12月)</span></div>
|
||||
<div class="time">
|
||||
<div class="week-list">
|
||||
<span v-for="(item, index) in weekList" :key="index">{{item}}</span>
|
||||
</div>
|
||||
<div class="day-list">
|
||||
<div v-for="(item, index) in 30" :key="index" class="item" :class="index == 7 ? 'active' : ''">
|
||||
<div class="num">{{item}}</div>
|
||||
<span class="status"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item__group">
|
||||
<div class="group_title">健康状况</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<span class="label">当前体温</span>
|
||||
</div>
|
||||
<div class="form-item__right">36.2℃</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<span class="label" style="width:190px;">14天内是否接触新冠确诊或疑似患者</span>
|
||||
</div>
|
||||
<div class="form-item__right">否</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<span class="label">当前健康状况</span>
|
||||
</div>
|
||||
<div class="form-item__right">感冒症状;乏力、咳嗽、发烧、肌肉痛、头痛</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pad-b112"></div>
|
||||
<div class="add-btn" @click="back">
|
||||
<div>查看其他成员</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'OtherStatistics',
|
||||
data() {
|
||||
return {
|
||||
weekList: ['一', '二', '三', '四', '五', '六', '日']
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState(['user']),
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
},
|
||||
onShow() {
|
||||
document.title = '健康上报'
|
||||
},
|
||||
methods: {
|
||||
back() {
|
||||
uni.navigateBack()
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
uni-page-body {
|
||||
height: 100%;
|
||||
}
|
||||
.OtherStatistics {
|
||||
|
||||
.emptyWrap {
|
||||
background: #f5f5f5;
|
||||
margin: 0;
|
||||
}
|
||||
::v-deep .emptyText{
|
||||
text-align: center;
|
||||
}
|
||||
.add-btn{
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 999;
|
||||
width: 100%;
|
||||
height: 112px;
|
||||
line-height: 112px;
|
||||
background: #3975C6;
|
||||
font-size: 32px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #FFF;
|
||||
div{
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .u-tab-bar{
|
||||
bottom: 14px;
|
||||
}
|
||||
|
||||
.form-item__group {
|
||||
margin-bottom: 24px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
padding-left: 32px;
|
||||
|
||||
.form-item__checkbox {
|
||||
width: 100%;
|
||||
div {
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
margin-bottom: 24px;
|
||||
text-align: center;
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
color: #333333;
|
||||
font-size: 28px;
|
||||
border: 1px solid #cccccc;
|
||||
|
||||
&.active {
|
||||
background: #4181ff;
|
||||
color: #fff;
|
||||
border-color: #4181ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.form-item__radio {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
|
||||
div {
|
||||
width: 212px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
margin-right: 16px;
|
||||
margin-bottom: 8px;
|
||||
text-align: center;
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
color: #333333;
|
||||
font-size: 28px;
|
||||
border: 1px solid #cccccc;
|
||||
|
||||
&:nth-of-type(3n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
&.active {
|
||||
background: #4181ff;
|
||||
color: #fff;
|
||||
border-color: #4181ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ai-area__wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 100px;
|
||||
|
||||
span {
|
||||
color: #333;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
i {
|
||||
color: #999;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 16px;
|
||||
height: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.form-item__wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 128px;
|
||||
padding-right: 28px;
|
||||
border-bottom: 1px solid #dddddd;
|
||||
|
||||
input {
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
text-align: right;
|
||||
color: #333;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.form-item__right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 32px;
|
||||
|
||||
.select {
|
||||
._i {
|
||||
padding-left: 100px;
|
||||
}
|
||||
}
|
||||
|
||||
span {
|
||||
max-width: 400px;
|
||||
margin-right: 8px;
|
||||
color: #333333;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
i {
|
||||
margin-right: 8px;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
.form-item__wrapper {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
.form-item__title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
i {
|
||||
font-size: 32px;
|
||||
color: #ff4466;
|
||||
}
|
||||
|
||||
span {
|
||||
font-size: 28px;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
h2 {
|
||||
padding: 0 4px;
|
||||
font-weight: 600;
|
||||
font-size: 32px;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
&.form-item__imgs,
|
||||
&.form-item__textarea {
|
||||
.form-item__wrapper {
|
||||
display: block;
|
||||
height: auto;
|
||||
padding-bottom: 32px;
|
||||
}
|
||||
|
||||
textarea {
|
||||
width: 100%;
|
||||
height: 90px;
|
||||
}
|
||||
|
||||
.form-item__title {
|
||||
padding: 32px 0;
|
||||
}
|
||||
|
||||
.form-item__right {
|
||||
padding-left: 18px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn-wrapper {
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
z-index: 11;
|
||||
width: 100%;
|
||||
padding: 20px 0 20px 0 !important;
|
||||
transform: translateX(-50%);
|
||||
background: #f3f6f9;
|
||||
}
|
||||
|
||||
.btn-wrapper .btn {
|
||||
width: 686px;
|
||||
height: 88px;
|
||||
line-height: 88px;
|
||||
margin: 0 auto;
|
||||
padding: 0 !important;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-size: 34px;
|
||||
background: #4181FF;
|
||||
border-radius: 16px;
|
||||
}
|
||||
|
||||
.btn-wrapper .disabled {
|
||||
color: #B9E7D0;
|
||||
background: #50C48A;
|
||||
}
|
||||
|
||||
::v-deep .AiTopFixed {
|
||||
.placeholder {
|
||||
.content {
|
||||
padding: 0 !important;
|
||||
|
||||
}
|
||||
}
|
||||
.fixed {
|
||||
margin: 0 !important;
|
||||
background-color: #f5f5f5!important;
|
||||
.content {
|
||||
padding: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.label{
|
||||
width: 280px;
|
||||
font-size: 32px!important;
|
||||
}
|
||||
.group_title{
|
||||
width: 100%;
|
||||
height: 116px;
|
||||
line-height: 116px;
|
||||
background: #FFF;
|
||||
padding-left: 32px;
|
||||
font-size: 38px;
|
||||
font-family: PingFangSC-Semibold, PingFang SC;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
}
|
||||
.time-content{
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
.title{
|
||||
line-height: 96px;
|
||||
padding-left: 32px;
|
||||
font-size: 36px;
|
||||
font-family: PingFang-SC-Bold, PingFang-SC;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
span{
|
||||
display: inline-block;
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
font-size: 26px;
|
||||
font-family: PingFang-SC-Heavy, PingFang-SC;
|
||||
color: #666;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
.time{
|
||||
padding: 0 32px 32px;
|
||||
background-color: #fff;
|
||||
margin-bottom: 24px;
|
||||
.week-list{
|
||||
span{
|
||||
display: inline-block;
|
||||
width: 98px;
|
||||
text-align: center;
|
||||
padding: 32px 0;
|
||||
font-size: 20px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
.day-list{
|
||||
.item{
|
||||
display: inline-block;
|
||||
width: 98px;
|
||||
height: 98px;
|
||||
text-align: center;
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
position: relative;
|
||||
.num{
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.status{
|
||||
position: absolute;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
top: 60px;
|
||||
left: 50%;
|
||||
margin-left: -4px;
|
||||
background: #3B87F6;
|
||||
}
|
||||
.status0{
|
||||
background: #999;
|
||||
}
|
||||
.status1{
|
||||
background: #3B87F6;
|
||||
}
|
||||
.status2{
|
||||
background: #f46;
|
||||
}
|
||||
}
|
||||
.active{
|
||||
.num{
|
||||
background: #3B87F6;
|
||||
color: #fff;
|
||||
}
|
||||
.status{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.pad-b112{
|
||||
padding-bottom: 112px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
112
src/sass/AppHealthUp/OtherUser.vue
Normal file
112
src/sass/AppHealthUp/OtherUser.vue
Normal file
@@ -0,0 +1,112 @@
|
||||
<template>
|
||||
<div class="OtherUser">
|
||||
<AiTopFixed>
|
||||
<div class="seachObjs">
|
||||
<u-search v-model="keyword" :clearabled="true" placeholder="请输入姓名" :show-action="false" bg-color="#F5F5F5" search-icon-color="#E2E8F1" color="#666" height="58" @search="handerSearch" @clear="handerClear"></u-search>
|
||||
</div>
|
||||
</AiTopFixed>
|
||||
<div class="user-list">
|
||||
<div class="item" @click="toOtherSta">
|
||||
<div class="left">
|
||||
<img src="./components/img/user-icon.png" alt="">李轶
|
||||
</div>
|
||||
<div class="right">
|
||||
今日已上报<img src="./components/img/right-icon.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'OtherUser',
|
||||
data() {
|
||||
return {
|
||||
keyword: '',
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState(['user']),
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
},
|
||||
onShow() {
|
||||
document.title = '其他成员'
|
||||
},
|
||||
methods: {
|
||||
toOtherSta() {
|
||||
uni.navigateTo({ url: './OtherStatistics'})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
uni-page-body{
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
}
|
||||
.OtherUser {
|
||||
.user-list{
|
||||
.item{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid #E4E5E6;
|
||||
padding: 24px 32px 22px 40px;
|
||||
background-color: #fff;
|
||||
.left{
|
||||
font-size: 36px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
line-height: 50px;
|
||||
img{
|
||||
width: 74px;
|
||||
height: 74px;
|
||||
margin-right: 34px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
.right{
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #999;
|
||||
line-height: 74px;
|
||||
img{
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
margin-left: 8px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
.color-F5A319{
|
||||
color: #F5A319;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.emptyWrap {
|
||||
background: #f5f5f5;
|
||||
margin: 0;
|
||||
}
|
||||
::v-deep .emptyText{
|
||||
text-align: center;
|
||||
}
|
||||
.seachObjs {
|
||||
background: #fff;
|
||||
}
|
||||
::v-deep .content{
|
||||
padding: 20px 32px;
|
||||
}
|
||||
|
||||
::v-deep .u-search{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
BIN
src/sass/AppHealthUp/components/img/right-icon.png
Normal file
BIN
src/sass/AppHealthUp/components/img/right-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 244 B |
BIN
src/sass/AppHealthUp/components/img/user-icon.png
Normal file
BIN
src/sass/AppHealthUp/components/img/user-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Reference in New Issue
Block a user