You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
354 lines
11 KiB
354 lines
11 KiB
<template>
|
|
<view class="publish-evaluation">
|
|
<view class="content">
|
|
<view class="satisify">
|
|
<view class="header">请对【{{ tit }}】的结果做出满意度评价</view>
|
|
<view class="satisify-btn" v-if="!voted">
|
|
<view class="type">
|
|
<image onTap="chooseSatisifyType" data-type="bad" :src="satisifyType == 'bad' ? notSatisifySelected : notSatisify" @click
|
|
="satisifyType = 'bad'"/>
|
|
<view :style="'color: ' + (satisifyType == 'bad' ? '#333' : '#999')">不满意</view>
|
|
</view>
|
|
<view class="type">
|
|
<image onTap="chooseSatisifyType" data-type="good" :src="satisifyType == 'good' ? normalSatisifySelected : normalSatisify" @click
|
|
="satisifyType = 'good'"/>
|
|
<view :style="'color: ' + (satisifyType == 'good' ? '#333' : '#999')">基本满意</view>
|
|
</view>
|
|
<view class="type">
|
|
<image onTap="chooseSatisifyType" data-type="perfect" :src="satisifyType == 'perfect' ? verySatisifySelected : verySatisify" @click
|
|
="satisifyType = 'perfect'" />
|
|
<view :style="'color: ' + (satisifyType == 'perfect' ? '#333' : '#999')">非常满意</view>
|
|
</view>
|
|
</view>
|
|
<view class="satisify-btn" v-else>
|
|
<view class="type">
|
|
<image :src="evaluateInfo.satisfaction == 'bad' ? notSatisifySelected : notSatisify" @click
|
|
="evaluateInfo.satisfaction = 'bad'"/>
|
|
<view :style="'color: ' + (evaluateInfo.satisfaction == 'bad' ? '#333' : '#999')">不满意</view>
|
|
</view>
|
|
<view class="type">
|
|
<image :src="evaluateInfo.satisfaction == 'good' ? normalSatisifySelected : normalSatisify" @click
|
|
="evaluateInfo.satisfaction = 'good'" />
|
|
<view :style="'color: ' + (evaluateInfo.satisfaction == 'good' ? '#333' : '#999')">基本满意</view>
|
|
</view>
|
|
<view class="type">
|
|
<image :src="evaluateInfo.satisfaction == 'perfect' ? verySatisifySelected : verySatisify" @click
|
|
="evaluateInfo.satisfaction = 'perfect'" />
|
|
<view :style="'color: ' + (evaluateInfo.satisfaction == 'perfect' ? '#333' : '#999')">非常满意</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="satisify-content">
|
|
<textarea
|
|
maxlength="99"
|
|
v-if="!voted"
|
|
:value="textareaValue"
|
|
v-model="textareaValue"
|
|
@change="bindTextareaValue"
|
|
placeholder="如有意见或建议请在此填写。"
|
|
placeholder-class="textarea-satisify"
|
|
></textarea>
|
|
<view v-else class="cont">{{ evaluateInfo.evaluateContent }}</view>
|
|
<view class="publish-evaluation-btn" v-if="!voted">
|
|
<view @click="publishEvaluation" class="submitbtn">发布评价</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { projectinitevaluation, evaluate, projectevaluate, initevaluation } from '../../utils/api/customerApi.js';
|
|
export default {
|
|
data() {
|
|
return {
|
|
notSatisify: '/static/data/images/rate/face1.png',
|
|
notSatisifySelected: '/static/data/images/rate/face1_light.png',
|
|
normalSatisify: '/static/data/images/rate/face2.png',
|
|
normalSatisifySelected: '/static/data/images/rate/face2_light.png',
|
|
verySatisify: '/static/data/images/rate/face3.png',
|
|
verySatisifySelected: '/static/data/images/rate/face3_light.png',
|
|
textareaValue: '',
|
|
evaluationCallbackVisible: false,
|
|
satisifyType: '',
|
|
issueId: '',
|
|
//议题已关闭
|
|
projectId: '',
|
|
//话题转项目
|
|
pageInit: '',
|
|
voted: false,
|
|
evaluateInfo: {
|
|
satisfaction: '',
|
|
evaluateContent: ''
|
|
},
|
|
tit: ''
|
|
};
|
|
},
|
|
async onLoad(options) {
|
|
let issueId = options.issueid;
|
|
let projectId = options.projectid;
|
|
let type = options.type;
|
|
let tit = options.tit;
|
|
this.setData({
|
|
issueId: issueId,
|
|
projectId: projectId,
|
|
tit: tit
|
|
});
|
|
if (type == 'closed') {
|
|
this.setData({
|
|
pageInit: 'issue'
|
|
});
|
|
await this.issueInit();
|
|
}
|
|
if (type == 'shift_project') {
|
|
this.setData({
|
|
pageInit: 'project'
|
|
});
|
|
await this.projectInit();
|
|
}
|
|
},
|
|
onShow() {},
|
|
methods: {
|
|
// textarea 双向绑定
|
|
bindTextareaValue(e) {
|
|
this.setData({
|
|
textareaValue: e.detail.value
|
|
});
|
|
},
|
|
|
|
// 发表评价
|
|
async publishEvaluation() {
|
|
if (!this.satisifyType) {
|
|
uni.showToast({
|
|
title: '请进行满意度评价',
|
|
icon: 'none',
|
|
duration: 1000
|
|
});
|
|
return false;
|
|
}
|
|
if (!this.textareaValue) {
|
|
uni.showToast({
|
|
title: '请填写评价内容',
|
|
icon: 'none',
|
|
duration: 1000
|
|
});
|
|
return false;
|
|
}
|
|
if (this.pageInit == 'issue') {
|
|
//议题已关闭
|
|
await this.issuePublish();
|
|
} else {
|
|
//项目已结案
|
|
await this.projectPublish();
|
|
}
|
|
},
|
|
|
|
// 选择 满意度
|
|
chooseSatisifyType(e) {
|
|
let type = e.currentTarget.dataset.type;
|
|
this.setData({
|
|
satisifyType: type //e.currentTarget.dataset.type
|
|
});
|
|
},
|
|
|
|
async issuePublish() {
|
|
uni.showLoading({
|
|
content: '正在审核中',
|
|
mask: true
|
|
});
|
|
const { issueId } = this;
|
|
const { code, data, msg } = await evaluate({
|
|
issueId: issueId,
|
|
satisfaction: this.satisifyType,
|
|
comment: this.textareaValue
|
|
});
|
|
uni.hideLoading();
|
|
if (msg === 'success' && code === 0) {
|
|
uni.redirectTo({
|
|
url: `/pages/detail/detail?issueId=${this.issueId}`
|
|
});
|
|
}
|
|
},
|
|
|
|
async projectPublish() {
|
|
uni.showLoading({
|
|
content: '正在审核中',
|
|
mask: true
|
|
});
|
|
const { projectId } = this;
|
|
const { code, data, msg } = await projectevaluate({
|
|
projectId: projectId,
|
|
satisfaction: this.satisifyType,
|
|
comment: this.textareaValue
|
|
});
|
|
uni.hideLoading();
|
|
if (msg === 'success' && code === 0) {
|
|
uni.redirectTo({
|
|
url: `/pages/detail/detail?issueId=${this.issueId}`
|
|
});
|
|
}
|
|
},
|
|
|
|
async issueInit() {
|
|
const { issueId } = this;
|
|
const { code, data, msg } = await initevaluation({
|
|
issueId
|
|
});
|
|
if (msg === 'success' && code === 0) {
|
|
this.setData({
|
|
voted: data.status,
|
|
evaluateInfo: data.evaluateInfo
|
|
});
|
|
}
|
|
},
|
|
|
|
async projectInit() {
|
|
const { projectId } = this;
|
|
const { code, data, msg } = await projectinitevaluation({
|
|
projectId
|
|
});
|
|
if (msg === 'success' && code === 0) {
|
|
this.setData({
|
|
voted: data.status,
|
|
evaluateInfo: data.evaluateInfo
|
|
});
|
|
}
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style>
|
|
page {
|
|
width: 100%;
|
|
height: 100vh;
|
|
}
|
|
.publish-evaluation {
|
|
width: 100%;
|
|
height: 100%;
|
|
background: #f7f7f7;
|
|
box-sizing: border-box;
|
|
padding: 20rpx;
|
|
}
|
|
.publish-evaluation .content {
|
|
width: 100%;
|
|
height: 970rpx;
|
|
background: #fff;
|
|
border-radius: 16rpx;
|
|
box-sizing: border-box;
|
|
padding: 0 25rpx;
|
|
}
|
|
|
|
.satisify {
|
|
width: 100%;
|
|
}
|
|
.satisify .header {
|
|
color: #333;
|
|
font-size: 32rpx;
|
|
padding: 20rpx 0 20rpx 0;
|
|
line-height: 40rpx;
|
|
display: table;
|
|
border-bottom: 1px solid #e7eeee;
|
|
}
|
|
.cont {
|
|
background: #f7f7f7;
|
|
border-radius: 16rpx;
|
|
font-size: 28rpx;
|
|
padding: 20rpx;
|
|
box-sizing: border-box;
|
|
min-height: 300rpx;
|
|
}
|
|
.satisify .satisify-btn {
|
|
width: 100%;
|
|
height: 260rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-around;
|
|
}
|
|
.satisify .satisify-btn .type {
|
|
height: 100%;
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
.satisify .satisify-btn .type image {
|
|
width: 100rpx;
|
|
height: 100rpx;
|
|
object-fit: cover;
|
|
}
|
|
.satisify .satisify-btn .type view {
|
|
font-size: 28rpx;
|
|
color: #999;
|
|
line-height: 90rpx;
|
|
height: 90rpx;
|
|
}
|
|
|
|
.satisify-content {
|
|
width: 100%;
|
|
height: 600rpx;
|
|
box-sizing: border-box;
|
|
padding-top: 30rpx;
|
|
padding-bottom: 40rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
/*align-content: center;*/
|
|
}
|
|
.satisify-content textarea {
|
|
width: 600rpx;
|
|
height: 460rpx;
|
|
font-size: 32rpx;
|
|
line-height: 46rpx;
|
|
margin: 0 auto;
|
|
background: #f7f7f7;
|
|
padding: 20rpx;
|
|
display: flex;
|
|
box-sizing: border-box;
|
|
border-radius: 16rpx;
|
|
color: #333;
|
|
}
|
|
.satisify-content .textarea-satisify {
|
|
font-size: 32rpx;
|
|
line-height: 46rpx;
|
|
color: #999;
|
|
}
|
|
|
|
.publish-evaluation-btn {
|
|
width: 100%;
|
|
height: 84rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-top: 60rpx;
|
|
}
|
|
.publish-evaluation-btn button {
|
|
width: 560rpx;
|
|
height: 80rpx;
|
|
padding: 0;
|
|
border-radius: 44rpx;
|
|
/*background: linear-gradient(to right, #F40C0C, #FF4E4E);*/
|
|
background: #e60000;
|
|
color: #fff;
|
|
font-size: 36rpx;
|
|
line-height: 86rpx;
|
|
text-align: center;
|
|
}
|
|
.submitbtn {
|
|
width: 560rpx;
|
|
height: 80rpx;
|
|
padding: 0;
|
|
border-radius: 40rpx;
|
|
/*background: linear-gradient(to right, #F40C0C, #FF4E4E);*/
|
|
background: #e60000;
|
|
color: #fff;
|
|
font-size: 36rpx;
|
|
line-height: 80rpx;
|
|
text-align: center;
|
|
}
|
|
.publish-evaluation-btn button::after {
|
|
border: 0;
|
|
}
|
|
.publish-evaluation-btn .hover-btn {
|
|
background: red;
|
|
}
|
|
</style>
|
|
|