Merge branch 'dev' of http://git.sinoecare.com/sinoecare/digital_village_v2/dvcp_v2_wechat_app into dev
This commit is contained in:
liuye
@@ -1,207 +1,178 @@
|
||||
<template>
|
||||
<div class="AiComment">
|
||||
<div class="comments flex-row">
|
||||
<div class="comments-box" @click="showCommentBox">{{ boxContent }}</div>
|
||||
<img src="./static/comment.svg" @click="showCommentList" alt=""/>
|
||||
<text>{{ commentCount || 0 }}</text>
|
||||
<div class="pageTitle flex">
|
||||
评论
|
||||
<div class="mar-l16" v-text="total"/>
|
||||
</div>
|
||||
<div class="modalWrapper" v-if="commentBoxPopup" :class="{clickClose:!modelClickClose}"
|
||||
@click="commentBoxPopup=false"/>
|
||||
<div class="commentBox" v-if="commentBoxPopup" :style="{bottom:marginBottom+ 'px'}">
|
||||
<textarea v-model="content" placeholder="写下你的想法…" maxlength="300" :focus="focus" @focus="getMarginBottom"
|
||||
@blur="marginBottom=0" :adjust-position="false" fixed/>
|
||||
<view class="flex-row form-submit">
|
||||
<div>{{ `字数 ${wordCount || 0} / 300` }}</div>
|
||||
<button @click="submitComment" :disabled="wordCount == 0">发布</button>
|
||||
</view>
|
||||
<div class="flex item" v-for="row in list" :key="row.id">
|
||||
<img :src="row.avatar"/>
|
||||
<div class="fill">
|
||||
<div class="flex font-32">
|
||||
<div class="fill font600 font-28" v-text="row.name"/>
|
||||
<AiThumbsUp :bid="row.id" type="comment" :count.sync="row.hotCount"/>
|
||||
</div>
|
||||
<div class="font-32 mar-t8 mar-b24" v-text="row.content"/>
|
||||
<div class="flex mar-b24">
|
||||
<div class="color-999" v-text="[row.areaName,row.commentTime].join(' ')"/>
|
||||
<comment-editor class="mar-l16" :bid="row.id" type="2">回复TA</comment-editor>
|
||||
</div>
|
||||
<div v-if="getArrayLength(row.replyList)>0" class="replyList">
|
||||
<div v-if="row.showAllReply">
|
||||
<div class="flex color-666 mar-t8" v-for="reply in row.replyList" :key="reply.id">
|
||||
<div class="font600" v-text="reply.name+'：'"/>
|
||||
<div v-text="reply.content"/>
|
||||
</div>
|
||||
<div v-if="getArrayLength(row.replyList)>2" class="color-687DA6 mar-t8" v-text="`收起`" @click="handleExpand(row)"/>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div class="flex color-666 mar-t8" v-for="reply in getReplies(row.replyList)" :key="reply.id">
|
||||
<div class="font600" v-text="reply.name+'：'"/>
|
||||
<div v-text="reply.content"/>
|
||||
</div>
|
||||
<div v-if="getArrayLength(row.replyList)>2" class="color-687DA6 mar-t8" v-text="`查看全部${getArrayLength(row.replyList)}条回复 >`"
|
||||
@click="handleExpand(row)"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<comment-editor class="fixedBottom" :bid="bid" :comment-count="total"/>
|
||||
<u-gap height="128"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import CommentEditor from "./commentEditor";
|
||||
import AiThumbsUp from "../AiThumbsUp/AiThumbsUp";
|
||||
|
||||
export default {
|
||||
name: "AiComment",
|
||||
components: {AiThumbsUp, CommentEditor},
|
||||
props: {
|
||||
needLogin: Boolean,
|
||||
customLogin: Boolean,
|
||||
commentCount: Number,
|
||||
modelClickClose: {type: Boolean, default: true}
|
||||
},
|
||||
computed: {
|
||||
wordCount() {
|
||||
return this.content.length || 0
|
||||
},
|
||||
boxContent() {
|
||||
return this.content || "我也说两句..."
|
||||
},
|
||||
isLogin() {
|
||||
return Boolean(uni.getStorageSync('token'))
|
||||
},
|
||||
bid: {default: ""}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
content: "",
|
||||
marginBottom: 0,
|
||||
commentBoxPopup: false,
|
||||
focus: false
|
||||
list: [],
|
||||
current: 1,
|
||||
total: 0
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
showCommentBox() {
|
||||
if (this.customLogin) {
|
||||
this.$emit("login", flag => this.commentBoxPopup = flag)
|
||||
} else if (this.needLogin) {
|
||||
if (this.isLogin) {
|
||||
this.commentBoxPopup = true
|
||||
} else {
|
||||
this.$dialog.confirm({
|
||||
content: '您还未登陆',
|
||||
confirmText: '去登录'
|
||||
}).then(() => {
|
||||
uni.switchTab({url: '/pages/mine/mine'})
|
||||
}).catch(() => {
|
||||
})
|
||||
}
|
||||
} else {
|
||||
this.commentBoxPopup = true
|
||||
getComments() {
|
||||
let {current, total, bid: contentId} = this
|
||||
if (!total || this.list.length < total) {
|
||||
this.$instance.post("/app/appcontentcomment/list", null, {
|
||||
params: {current, contentId}
|
||||
}).then(res => {
|
||||
if (res?.data) {
|
||||
res.data.records.map(e => e.showAllReply = false)
|
||||
this.list = [current == 1 ? [] : this.list, res.data.records].flat()
|
||||
this.total = res.data.total
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
submitComment() {
|
||||
this.commentBoxPopup = false
|
||||
this.$emit("submitComment", this.content)
|
||||
this.content = ""
|
||||
getReplies(list, showAll) {
|
||||
return list?.slice(0, showAll ? this.getArrayLength(list) : 2) || []
|
||||
},
|
||||
showCommentList() {
|
||||
this.commentBoxPopup = false
|
||||
this.$emit("showCommentList")
|
||||
getArrayLength(list) {
|
||||
return list?.length || 0
|
||||
},
|
||||
getMarginBottom({detail}) {
|
||||
this.marginBottom = detail.height
|
||||
this.focus = true
|
||||
handleExpand(row) {
|
||||
console.log(row)
|
||||
row.showAllReply = !row.showAllReply
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getComments()
|
||||
uni.$on("moreComments", flag => {
|
||||
flag ? this.current = 1 : this.current++
|
||||
this.getComments()
|
||||
})
|
||||
},
|
||||
destroyed() {
|
||||
uni.$off("moreComments")
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
.AiComment {
|
||||
.comments {
|
||||
width: 100%;
|
||||
height: 112px;
|
||||
background: #fff;
|
||||
|
||||
.item {
|
||||
padding: 24px 32px;
|
||||
box-sizing: border-box;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
background: #f7f7f7;
|
||||
align-items: flex-start;
|
||||
color: #333;
|
||||
font-size: 26px;
|
||||
|
||||
.comments-box {
|
||||
width: 580px;
|
||||
& > img {
|
||||
height: 64px;
|
||||
line-height: 64px;
|
||||
background-color: #fff;
|
||||
color: #666;
|
||||
font-size: 26px;
|
||||
padding-left: 16px;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
width: 64px;
|
||||
border-radius: 50%;
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 52px;
|
||||
height: 52px;
|
||||
margin-left: 16px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
text {
|
||||
color: #666666;
|
||||
font-size: 28px;
|
||||
line-height: 60px;
|
||||
.content {
|
||||
margin: 8px 0 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.modalWrapper {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(0, 0, 0, .6);
|
||||
z-index: 9;
|
||||
|
||||
&.clickClose {
|
||||
pointer-events: none;
|
||||
}
|
||||
.font600 {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.commentBox {
|
||||
width: 100%;
|
||||
height: 288px;
|
||||
background-color: #fff;
|
||||
padding: 32px 32px 24px 26px;
|
||||
box-sizing: border-box;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
z-index: 99;
|
||||
|
||||
textarea {
|
||||
width: 100%;
|
||||
height: 144px;
|
||||
color: #666;
|
||||
font-size: 26px;
|
||||
background: #F7F7F7;
|
||||
border-radius: 16px;
|
||||
padding: 16px;
|
||||
box-sizing: border-box;
|
||||
|
||||
&::placeholder {
|
||||
font-size: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
.form-submit {
|
||||
margin-top: 24px;
|
||||
height: 64px;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
color: #999;
|
||||
font-size: 24px;
|
||||
|
||||
button {
|
||||
width: 144px;
|
||||
height: 64px;
|
||||
background-color: #135AB8;
|
||||
color: #fff;
|
||||
font-size: 24px;
|
||||
border-radius: 32px;
|
||||
line-height: 64px;
|
||||
text-align: center;
|
||||
margin: unset;
|
||||
|
||||
&[disabled] {
|
||||
color: #999;
|
||||
background-color: #f7f7f7;
|
||||
font-size: 28px;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
&:active {
|
||||
opacity: .8;
|
||||
}
|
||||
|
||||
&:after {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
.font-32 {
|
||||
font-size: 32px;
|
||||
}
|
||||
|
||||
.flex-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
.font-28 {
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.mar-t8 {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.mar-b24 {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.mar-r16 {
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
.mar-l16 {
|
||||
margin-left: 16px;
|
||||
}
|
||||
|
||||
.color-999 {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.color-666 {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.color-687DA6 {
|
||||
color: #687DA6;
|
||||
}
|
||||
|
||||
.replyList {
|
||||
padding: 8px 16px 16px;
|
||||
background: #F4F5FA;
|
||||
border-radius: 8px;
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.pageTitle {
|
||||
height: 100px;
|
||||
padding: 0 32px;
|
||||
font-size: 34px;
|
||||
font-family: PingFangSC-Semibold, PingFang SC;
|
||||
font-weight: 600;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
217
src/components/AiComment/commentEditor.vue
Normal file
217
src/components/AiComment/commentEditor.vue
Normal file
@@ -0,0 +1,217 @@
|
||||
<template>
|
||||
<section class="commentEditor">
|
||||
<div v-if="$slots.default" @click="showCommentBox">
|
||||
<slot/>
|
||||
</div>
|
||||
<div v-else class="comments flex-row">
|
||||
<div class="comments-box" @click="showCommentBox">{{ boxContent }}</div>
|
||||
<img src="./static/comment.svg" alt=""/>
|
||||
<text>{{ commentCount || 0 }}</text>
|
||||
</div>
|
||||
<div class="modalWrapper" v-if="commentBoxPopup" :class="{clickClose:!modelClickClose}"
|
||||
@click="commentBoxPopup=false"/>
|
||||
<div class="commentBox" v-if="commentBoxPopup" :style="{bottom:marginBottom+ 'px'}">
|
||||
<textarea v-model="content" placeholder="写下你的想法…" maxlength="300" :focus="focus" @focus="getMarginBottom"
|
||||
@blur="marginBottom=0" :adjust-position="false" fixed/>
|
||||
<view class="flex-row form-submit">
|
||||
<div>{{ `字数 ${wordCount || 0} / 300` }}</div>
|
||||
<button @click="submitComment" :disabled="wordCount == 0">发布</button>
|
||||
</view>
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "commentEditor",
|
||||
props: {
|
||||
bid: {default: ""},
|
||||
type: {default: 1},
|
||||
needLogin: Boolean,
|
||||
customLogin: Boolean,
|
||||
commentCount: Number,
|
||||
modelClickClose: {type: Boolean, default: true}
|
||||
},
|
||||
computed: {
|
||||
wordCount() {
|
||||
return this.content.length || 0
|
||||
},
|
||||
boxContent() {
|
||||
return this.content || "我也说两句..."
|
||||
},
|
||||
isLogin() {
|
||||
return Boolean(uni.getStorageSync('token'))
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
content: "",
|
||||
marginBottom: 0,
|
||||
commentBoxPopup: false,
|
||||
focus: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
showCommentBox() {
|
||||
if (this.customLogin) {
|
||||
this.$emit("login", flag => this.commentBoxPopup = flag)
|
||||
} else if (this.needLogin) {
|
||||
if (this.isLogin) {
|
||||
this.commentBoxPopup = true
|
||||
} else {
|
||||
this.$dialog.confirm({
|
||||
content: '您还未登陆',
|
||||
confirmText: '去登录'
|
||||
}).then(() => {
|
||||
uni.switchTab({url: '/pages/mine/mine'})
|
||||
}).catch(() => {
|
||||
})
|
||||
}
|
||||
} else {
|
||||
this.commentBoxPopup = true
|
||||
}
|
||||
},
|
||||
submitComment() {
|
||||
let {content, type, bid: contentId} = this
|
||||
this.$instance.post("/app/appcontentcomment/addByApplet", {content, type, contentId}).then(res => {
|
||||
if (res?.code == 0) {
|
||||
this.$u.toast("提交成功!")
|
||||
this.commentBoxPopup = false
|
||||
this.content = ""
|
||||
uni.$emit("moreComments", 1)//刷新评论列表
|
||||
}
|
||||
})
|
||||
},
|
||||
getMarginBottom({detail}) {
|
||||
this.marginBottom = detail.height
|
||||
this.focus = true
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.commentEditor {
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
|
||||
.comments {
|
||||
width: 100%;
|
||||
height: 128px;
|
||||
padding: 24px 32px;
|
||||
box-sizing: border-box;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
background: #fff;
|
||||
border-top: 1px solid #eee;
|
||||
|
||||
.comments-box {
|
||||
width: 580px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
background-color: #F4F5FA;
|
||||
color: #666;
|
||||
font-size: 32px;
|
||||
padding-left: 32px;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
border-radius: 44px;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 52px;
|
||||
height: 52px;
|
||||
margin-left: 16px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
text {
|
||||
color: #666666;
|
||||
font-size: 28px;
|
||||
line-height: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
.modalWrapper {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(0, 0, 0, .6);
|
||||
z-index: 9;
|
||||
|
||||
&.clickClose {
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
|
||||
.commentBox {
|
||||
width: 100vw;
|
||||
height: 288px;
|
||||
background-color: #fff;
|
||||
padding: 32px 32px 24px 26px;
|
||||
box-sizing: border-box;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
z-index: 99;
|
||||
|
||||
textarea {
|
||||
width: 100%;
|
||||
height: 144px;
|
||||
color: #666;
|
||||
font-size: 26px;
|
||||
background: #F7F7F7;
|
||||
border-radius: 16px;
|
||||
padding: 16px;
|
||||
box-sizing: border-box;
|
||||
|
||||
&::placeholder {
|
||||
font-size: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
.form-submit {
|
||||
margin-top: 24px;
|
||||
height: 64px;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
color: #999;
|
||||
font-size: 24px;
|
||||
|
||||
button {
|
||||
width: 144px;
|
||||
height: 64px;
|
||||
background-color: #135AB8;
|
||||
color: #fff;
|
||||
font-size: 24px;
|
||||
border-radius: 32px;
|
||||
line-height: 64px;
|
||||
text-align: center;
|
||||
margin: unset;
|
||||
|
||||
&[disabled] {
|
||||
color: #999;
|
||||
background-color: #f7f7f7;
|
||||
font-size: 28px;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
&:active {
|
||||
opacity: .8;
|
||||
}
|
||||
|
||||
&:after {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.flex-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -18,8 +18,6 @@
|
||||
<div class="files" v-if="detail.contentType==1 && detail.files && detail.files.length">
|
||||
<video class="file-img" :src="file.url" v-for="(file,index) in detail.files" :key="index"/>
|
||||
</div>
|
||||
|
||||
<div v-if="comment" class="comments"/>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
@@ -30,7 +28,6 @@ export default {
|
||||
props: {
|
||||
title: {default: ""},
|
||||
detail: {default: () => ({})},
|
||||
comment: Boolean
|
||||
},
|
||||
methods: {
|
||||
preview(index) {
|
||||
@@ -42,8 +39,8 @@ export default {
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.AiDetail {
|
||||
min-height: 100vh;
|
||||
background: #ffffff;
|
||||
padding-bottom: 80px;
|
||||
background: #fff;
|
||||
|
||||
.header {
|
||||
.title {
|
||||
|
||||
62
src/components/AiThumbsUp/AiThumbsUp.vue
Normal file
62
src/components/AiThumbsUp/AiThumbsUp.vue
Normal file
@@ -0,0 +1,62 @@
|
||||
<template>
|
||||
<section class="AiThumbsUp flex" :class="{checked}" @click.native="handleClick">
|
||||
<div class="count" v-text="count||0"/>
|
||||
<u-icon :name="thumbIcon"/>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "AiThumbsUp",
|
||||
props: {
|
||||
bid: {default: ""},
|
||||
count: {default: 0},
|
||||
btn: Boolean,
|
||||
type: {default: "content"},
|
||||
action: {default: ""}
|
||||
},
|
||||
computed: {
|
||||
thumbIcon() {
|
||||
return this.checked ? "thumb-up-fill" : "thumb-up"
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
checked: false,
|
||||
actions: {
|
||||
content: "/app/appcontentinfo/supportById",
|
||||
comment: "/app/appcontentcomment/supportById",
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleClick() {
|
||||
if (!this.checked) {
|
||||
let {action, type, actions, bid: id} = this
|
||||
this.$instance.post(action || actions[type], null, {
|
||||
params: {id}
|
||||
}).then(res => {
|
||||
if (res?.code == 0) {
|
||||
this.checked = true
|
||||
this.$emit("update:count", ++this.count)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.AiThumbsUp {
|
||||
color: #666;
|
||||
|
||||
&.checked {
|
||||
color: #2D7DFF;
|
||||
}
|
||||
|
||||
.count {
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -10,7 +10,7 @@
|
||||
</div>
|
||||
<div class="home-list">
|
||||
<div class="item" v-for="(item, index) in list" :key="index" >
|
||||
<div class="item-top" @click.stop="$linkTo('./UserInfo?id=' + item.id)">
|
||||
<div class="item-top" @click.stop="$linkTo('./Detail?id=' + item.id)">
|
||||
<div class="item-top__left">
|
||||
<h2>{{ item.name }}<span :class="item.status == 1? 'status0':'status1'">返乡人员</span></h2>
|
||||
<!-- <p @click.stop="$linkTo('./UserInfo?id=' + item.id)" hover-class="text-hover">查看个人信息></p> -->
|
||||
|
||||
@@ -1,72 +1,48 @@
|
||||
<template>
|
||||
<div class="detail">
|
||||
<div class="detail-info">
|
||||
<h2>健康状况</h2>
|
||||
<div class="detail-info__item">
|
||||
<div class="left">
|
||||
<label>当前体温</label>
|
||||
</div>
|
||||
<div class="right">
|
||||
<span :style="{color: info.temperature >= 37.3 ? '#FF4466' : '#42D784'}">{{ info.temperature }}℃</span>
|
||||
</div>
|
||||
<div class="detail-header">
|
||||
<div class="name">
|
||||
<h2>张三<span>返乡人员</span></h2>
|
||||
<p><u-icon name="phone" color="#4181FF" size="28"></u-icon>拨打电话</p>
|
||||
</div>
|
||||
<div class="detail-info__item">
|
||||
<div class="left">
|
||||
<label>14天内是否接触新冠确诊或疑似患者</label>
|
||||
</div>
|
||||
<div class="right">
|
||||
<span :style="{color: info.touchInFourteen === '0' ? '#42D784' : '#FF4466'}">{{ $dict.getLabel('epidemicTouchInFourteen', info.touchInFourteen) }}</span>
|
||||
</div>
|
||||
<div class="idNumber">
|
||||
<span>身份证号：</span>
|
||||
<span>420107197309172837</span>
|
||||
</div>
|
||||
<div class="detail-info__item">
|
||||
<div class="left">
|
||||
<label>当前健康状况</label>
|
||||
</div>
|
||||
<div class="right">
|
||||
<span :style="{color: !info.isHealth ? '#42D784' : '#FF4466'}">{{ info.healthName }}</span>
|
||||
</div>
|
||||
<div class="phone">
|
||||
<span>手机号码：</span>
|
||||
<span>13827263092</span>
|
||||
</div>
|
||||
<div class="address">
|
||||
<span>详细地址：</span>
|
||||
<span>辛店镇北靳楼-北靳楼大学学生宿舍560</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="detail-info">
|
||||
<h2>核酸检测信息</h2>
|
||||
<div class="detail-info__item">
|
||||
<div class="title">
|
||||
<div class="left">
|
||||
<label>核酸检测日期</label>
|
||||
<h2>上报记录</h2>
|
||||
<p>个人连续无异常上报<span>7</span>>天后自动解除风险</p>
|
||||
</div>
|
||||
<div class="right">
|
||||
<span>{{ info.checkTime.split(' ')[0] }}</span>
|
||||
<span>3</span>/<span>7</span>天
|
||||
</div>
|
||||
</div>
|
||||
<div class="detail-info__item">
|
||||
<div class="left">
|
||||
<label>核酸检测结果</label>
|
||||
</div>
|
||||
<div class="right">
|
||||
<span :style="{color: info.checkResult === '0' ? '#42D784' : '#FF4466'}">{{ $dict.getLabel('epidemicRecentTestResult', info.checkResult) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="detail-info__item">
|
||||
<div class="left">
|
||||
<label>健康码状态</label>
|
||||
</div>
|
||||
<div class="right">
|
||||
<span :style="{color: info.healthCode === '0' || info.healthCode === '1' ? '#42D784' : '#FF4466'}">{{ $dict.getLabel('epidemicHealthCode', info.healthCode) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="detail-info__item">
|
||||
<div class="left">
|
||||
<label>已接种疫苗次数</label>
|
||||
</div>
|
||||
<div class="right">
|
||||
<span>{{ $dict.getLabel('epidemicVaccineTime', info.vaccine) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="detail-info__item detail-info__item--img">
|
||||
<div class="left">
|
||||
<label>本人健康码截图</label>
|
||||
</div>
|
||||
<div class="right">
|
||||
<image :src="item.url" @click="preview(item.url)" v-for="(item, index) in info.checkPhoto" :key="index" />
|
||||
<div class="list">
|
||||
<div class="item">
|
||||
<div class="item_card">
|
||||
<div class="left">
|
||||
<span></span><span>2020-07-20</span><span>（自主上报）</span>
|
||||
</div>
|
||||
<div class="right">
|
||||
<span>异常</span>
|
||||
<u-icon name="arrow-down" color="#999" size="28"></u-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item_info">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -75,7 +51,7 @@
|
||||
|
||||
<script>
|
||||
export default {
|
||||
appName:"上报详情",
|
||||
appName:"上报记录",
|
||||
data () {
|
||||
return {
|
||||
info: {},
|
||||
@@ -83,12 +59,12 @@
|
||||
}
|
||||
},
|
||||
|
||||
onLoad (query) {
|
||||
this.$loading()
|
||||
this.$dict.load(['epidemicTouchInFourteen', 'epidemicRecentHealth', 'epidemicRecentTestResult', 'epidemicHealthCode', 'epidemicVaccineTime']).then(() => {
|
||||
this.getInfo(query.id)
|
||||
})
|
||||
},
|
||||
// onLoad (query) {
|
||||
// this.$loading()
|
||||
// this.$dict.load(['epidemicTouchInFourteen', 'epidemicRecentHealth', 'epidemicRecentTestResult', 'epidemicHealthCode', 'epidemicVaccineTime']).then(() => {
|
||||
// this.getInfo(query.id)
|
||||
// })
|
||||
// },
|
||||
|
||||
methods: {
|
||||
preview (url) {
|
||||
@@ -137,108 +113,104 @@
|
||||
|
||||
.detail-header {
|
||||
padding: 32px;
|
||||
background: #fff;
|
||||
|
||||
h2 {
|
||||
margin-bottom: 32px;
|
||||
color: #333333;
|
||||
font-size: 40px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.item-info {
|
||||
.item-info__item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 8px;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
margin-right: 16px;
|
||||
}
|
||||
box-sizing: border-box;
|
||||
background: #FFF;
|
||||
|
||||
.name {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
h2 {
|
||||
font-weight: 600;
|
||||
font-size: 40px;
|
||||
span {
|
||||
color: #333;
|
||||
font-size: 28px;
|
||||
font-weight: normal;
|
||||
font-size: 26px;
|
||||
padding: 4px 8px;
|
||||
margin-left: 16px;
|
||||
background: #FFF5F7;
|
||||
color: #FF4466;
|
||||
}
|
||||
}
|
||||
p {
|
||||
font-size: 26px;
|
||||
color: #4181FF;
|
||||
}
|
||||
}
|
||||
|
||||
.idNumber,
|
||||
.phone,
|
||||
.address {
|
||||
color: #999999;
|
||||
font-size: 26px;
|
||||
margin-top: 8px;
|
||||
|
||||
span:first-child {
|
||||
display: inline-block;
|
||||
width: 130px;
|
||||
vertical-align: top;
|
||||
}
|
||||
span:last-child {
|
||||
display: inline-block;
|
||||
width: calc(100% - 130px);
|
||||
vertical-align: top;
|
||||
}
|
||||
}
|
||||
.idNumber {
|
||||
margin-top: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.detail-info {
|
||||
margin-top: 24px;
|
||||
padding: 0 32px;
|
||||
background: #fff;
|
||||
background: #FFF;
|
||||
padding: 32px;
|
||||
box-sizing: border-box;
|
||||
|
||||
& > h2 {
|
||||
height: 116px;
|
||||
line-height: 116px;
|
||||
font-size: 38px;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.detail-info__item {
|
||||
.title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 34px 0;
|
||||
border-bottom: 1px solid #DDDDDD;
|
||||
|
||||
&:last-child {
|
||||
border: none;
|
||||
}
|
||||
|
||||
align-items: center;
|
||||
.left {
|
||||
display: flex;
|
||||
line-height: 1.3;
|
||||
max-width: 360px;
|
||||
|
||||
label {
|
||||
position: relative;
|
||||
h2 {
|
||||
font-size: 38px;
|
||||
color: #333333;
|
||||
font-weight: 600;
|
||||
}
|
||||
p {
|
||||
font-size: 26px;
|
||||
color: #999999;
|
||||
font-size: 32px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
display: flex;
|
||||
max-width: 450px;
|
||||
|
||||
span {
|
||||
color: #333333;
|
||||
font-size: 32px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
color: #999999;
|
||||
font-size: 28px;
|
||||
span:first-child {
|
||||
color: #4181FF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.detail-info__item--img {
|
||||
display: block;
|
||||
|
||||
.right {
|
||||
flex-wrap: wrap;
|
||||
max-width: 100%;
|
||||
margin-top: 34px;
|
||||
|
||||
image {
|
||||
width: 226px;
|
||||
height: 226px;
|
||||
margin: 0 9px 9px 0;
|
||||
|
||||
&:nth-of-type(3n) {
|
||||
margin-right: 0;
|
||||
.list {
|
||||
.item {
|
||||
.item_card {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 26px 0;
|
||||
.left {
|
||||
span:first-child {
|
||||
display: inline-block;
|
||||
width: 4px;
|
||||
height: 24px;
|
||||
background: #1365DD;
|
||||
vertical-align: center;
|
||||
margin-right: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,134 +0,0 @@
|
||||
<template>
|
||||
<div class="userinfo" v-if="pageShow">
|
||||
<div class="cell-group">
|
||||
<div class="cell-item">
|
||||
<div class="cell-item__wrapper">
|
||||
<div class="left">
|
||||
<span>上报人姓名</span>
|
||||
</div>
|
||||
<div class="right">
|
||||
<span>{{ info.name }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cell-item">
|
||||
<div class="cell-item__wrapper">
|
||||
<div class="left">
|
||||
<span>身份证号</span>
|
||||
</div>
|
||||
<div class="right">
|
||||
<span>{{ info.idNumber }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cell-item">
|
||||
<div class="cell-item__wrapper">
|
||||
<div class="left">
|
||||
<span>手机号码</span>
|
||||
</div>
|
||||
<div class="right">
|
||||
<span>{{ info.phone }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cell-item">
|
||||
<div class="cell-item__wrapper">
|
||||
<div class="left">
|
||||
<span>上报地区</span>
|
||||
</div>
|
||||
<div class="right">
|
||||
<span>{{ info.areaName }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cell-item">
|
||||
<div class="cell-item__wrapper">
|
||||
<div class="left">
|
||||
<span>详细地址</span>
|
||||
</div>
|
||||
<div class="right">
|
||||
<span>{{ info.address }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
appName:"个人信息",
|
||||
data () {
|
||||
return {
|
||||
info: {},
|
||||
pageShow: false
|
||||
}
|
||||
},
|
||||
|
||||
onLoad (query) {
|
||||
this.$loading()
|
||||
this.getInfo(query.id)
|
||||
},
|
||||
|
||||
methods: {
|
||||
getInfo (id) {
|
||||
this.$instance.post(`/app/appepidemicreportmember/queryDetailById?id=${id}`).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.info = res.data
|
||||
if (res.data.eventStatus > 1) {
|
||||
this.result = res.data.processList[0]
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
this.pageShow = true
|
||||
})
|
||||
}
|
||||
|
||||
this.$hideLoading()
|
||||
}).catch(() => {
|
||||
this.$hideLoading()
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.userinfo {
|
||||
.cell-group {
|
||||
background: #fff;
|
||||
|
||||
.cell-item {
|
||||
padding-left: 32px;
|
||||
|
||||
.cell-item__wrapper {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 34px 32px 34px 0;
|
||||
border-bottom: 1px solid #DDDDDD;
|
||||
|
||||
.left {
|
||||
span {
|
||||
color: #999999;
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
max-width: 450px;
|
||||
text-align: right;
|
||||
span {
|
||||
color: #333333;
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
.cell-item__wrapper {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -42,7 +42,7 @@
|
||||
<div class="addbtn" @click="toReport" hover-class="text-hover">添加返乡报备</div>
|
||||
</div>
|
||||
|
||||
<u-popup v-model="show" mode="center" border-radius="14" height="300px">
|
||||
<u-popup v-model="show" mode="center" border-radius="14" width="90%" height="150px">
|
||||
<view>出淤泥而不染，濯清涟而不妖</view>
|
||||
<view>出淤泥而不染，濯清涟而不妖</view>
|
||||
<view>出淤泥而不染，濯清涟而不妖</view>
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
<template>
|
||||
<section class="contentDetail">
|
||||
<AiDetail :detail="detail" :props="props"/>
|
||||
<u-gap height="16"/>
|
||||
<AiComment v-if="detail.id&&detail.isComment==1" :bid="detail.id"/>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
@@ -8,7 +10,7 @@
|
||||
|
||||
export default {
|
||||
name: "contentDetail",
|
||||
appName:"内容详情",
|
||||
appName: "内容详情",
|
||||
data() {
|
||||
return {
|
||||
detail: {title: "内容详情"},
|
||||
@@ -35,12 +37,14 @@ export default {
|
||||
})
|
||||
},
|
||||
},
|
||||
|
||||
onShareAppMessage() {
|
||||
return {
|
||||
title: this.detail.title,
|
||||
path: '/mods/AppContent/contentDetail?id=' + this.id
|
||||
};
|
||||
},
|
||||
onReachBottom() {
|
||||
uni.$emit("moreComments")
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user