kubbo/dvcp_v2_webapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

初始化

Browse Source
This commit is contained in:
aixianling
2021-12-14 18:36:19 +08:00
parent 9afa4101b6
commit a8dff862d2
327 changed files with 88702 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

263
packages/wechat/AppAsk/components/Detail.vue Normal file
View File

@@ -0,0 +1,263 @@
<template>
<ai-detail>
<template slot="title">
<ai-title title="随心问详情" isShowBack isShowBottomBorder @onBackClick="cancel(true)">
<template slot="rightBtn">
<el-button
@click="close"
size="small"
v-if="info.status !== '2'"
icon="iconfont iconReject">
关闭留言
</el-button>
<el-button
size="small"
type="primary"
v-if="info.status !== '2'"
icon="iconfont iconRegister"
@click="isShow = true">
回复留言
</el-button>
</template>
</ai-title>
</template>
<template slot="content">
<ai-card title="基本信息">
<template #content>
<ai-wrapper
label-width="56px">
<ai-info-item label="标题" isLine>{{ info.title }}</ai-info-item>
<ai-info-item label="提问状态">
<span :style="{color: info.status === '0' ? '#F79300' : '#222'}">{{
dict.getLabel('leaveMessageStatus', info.status)
}}</span>
</ai-info-item>
<ai-info-item label="提问编号">{{ info.msgCode }}</ai-info-item>
<ai-info-item label="提问人">{{ info.leaveName }}</ai-info-item>
<ai-info-item label="提问时间">{{ info.createTime }}</ai-info-item>
<ai-info-item label="提问内容" isLine>{{ info.content }}</ai-info-item>
</ai-wrapper>
</template>
</ai-card>
<ai-card title="沟通记录">
<template #content>
<div class="comments">
<div class="comments-item" v-for="(item, index) in info.appLeaveMessageReplyList" :key="index"
:class="[item.userType === '1' ? 'comments-item__replay' : '']">
<div class="comments-item__body">
<div class="comments-item__top">
<img class="comments-item__avatar" v-if="item.headPortrait" :src="item.headPortrait">
<span v-else>{{ item.createUserName.substr(item.createUserName.length - 2) }}</span>
<div class="comments-item__middle">
<div class="comments-item__middle--top">
<h2 v-if="item.userType === '0'">{{ item.createUserName }}</h2>
<h3 v-if="item.userType === '1'">{{ item.createUnitName }}</h3>
<h2 v-if="item.userType === '1'">回复</h2>
</div>
<p v-if="item.userType === '1'">操作员：{{ item.createUserName }}{{ item.createUserPhone }}</p>
</div>
<i class="comment-item__date">{{ item.createTime }}</i>
</div>
<div class="comments-item__content">
<p>{{ item.content }}</p>
<ai-uploader :instance="instance" :disabled="true" v-model="item.images"></ai-uploader>
</div>
</div>
</div>
<div slot="empty" class="no-data" style="height:160px;" v-if="!info.appLeaveMessageReplyList.length"></div>
</div>
</template>
</ai-card>
<ai-dialog
:visible.sync="isShow"
width="800px"
title="回复留言"
@close="onClose"
@onConfirm="confirm">
<el-form label-width="90px" :model="form" ref="form">
<el-form-item label="回复内容" prop="content" :rules="[{required: true, message: '请输入回复内容', trigger: 'blur'}]">
<el-input :maxlength="500" show-word-limit type="textarea" :rows="5" v-model="form.content"
placeholder="请输入回复内容"></el-input>
</el-form-item>
<el-form-item label="图片附件" prop="imgs">
<ai-uploader :instance="instance" v-model="form.images" :limit="9"></ai-uploader>
</el-form-item>
</el-form>
</ai-dialog>
</template>
</ai-detail>
</template>
<script>
import {mapState} from 'vuex'
export default {
name: 'detail',
props: {
instance: Function,
dict: Object,
params: Object
},
data() {
return {
isShow: false,
info: {
appLeaveMessageReplyList: []
},
form: {
explain: '',
images: []
},
imgs: []
}
},
computed: {
...mapState(['user'])
},
created() {
this.getInfo(this.params.id)
},
methods: {
getInfo(id) {
this.instance.post(`/app/appleavemessage/queryDetailById?id=${id}`).then(res => {
if (res?.data) {
this.info = res.data
this.info.appLeaveMessageReplyList = res.data.appLeaveMessageReplyList.map(item => {
item.images = JSON.parse(item.images).map(e => ({
...e,
url: e.accessUrl || e.url || e?.file?.accessUrl
}))
return item
})
}
})
},
onClose() {
this.form.explain = ''
},
close() {
this.$confirm('确定关闭该数据？').then(() => {
this.instance.post(`/app/appleavemessage/addOrUpdate`, {
id: this.params.id,
status: 2
}).then(res => {
if (res.code == 0) {
this.$message.success('关闭成功！')
this.cancel(true)
}
})
})
},
confirm() {
this.$refs.form.validate((valid) => {
if (valid) {
this.instance.post(`/app/appleavemessagereply/addOrUpdate`, {
content: this.form.content,
msgCode: this.info.msgCode,
userType: '1',
createUnitId: this.user.info.unitId,
createUnitName: this.user.info.unitName,
images: this.form.images.length ? JSON.stringify(this.form.images) : '[]'
}).then(res => {
if (res.code == 0) {
this.isShow = false
this.$message.success('回复成功')
this.getInfo(this.params.id)
}
})
}
})
},
cancel(isRefresh) {
this.$emit('change', {
type: 'list',
isRefresh: !!isRefresh
})
}
}
}
</script>
<style scoped lang="scss">
.comments {
.comments-item__body, .comments-replay__item {
margin-bottom: 24px;
padding: 16px 40px 10px 16px;
}
.comments-item__replay {
background: #F5F6F9;
}
.comments-item__top {
display: flex;
align-items: center;
.comments-item__middle {
flex: 1;
margin-bottom: 6px;
.comments-item__middle--top {
display: flex;
align-items: center;
h2, h3 {
font-size: 14px;
font-weight: 700;
color: #222;
}
h3 {
margin-right: 6px;
color: #2266FF;
}
}
p {
margin-top: 4px;
color: #888888;
font-size: 12px;
}
}
.comment-item__date {
color: #888888;
font-size: 14px;
font-style: normal;
}
.comments-item__avatar, span {
flex-shrink: 1;
width: 40px;
height: 40px;
line-height: 40px;
margin-right: 8px;
text-align: center;
border-radius: 50%;
color: #fff;
font-size: 14px;
background: #2266FF;
}
}
.comments-item__content {
padding-left: 48px;
p {
margin-bottom: 16px;
line-height: 22px;
color: #222222;
font-size: 14px;
}
}
.comments-item__body {
&:last-child {
margin-bottom: 0;
}
}
}
</style>