286 lines
8.3 KiB
Vue
286 lines
8.3 KiB
Vue
<template>
|
|
<view class="con-body">
|
|
<view class="con-bg">
|
|
<!-- 头部 -->
|
|
<customHeader ref="customHeaderRef" :title="'走访报告详情'" :leftFlag="true" :rightFlag="false"></customHeader>
|
|
|
|
<!-- 高度来避免头部遮挡 -->
|
|
<view class="top-height"></view>
|
|
|
|
<!-- 正文内容 -->
|
|
<!-- 详情内容 -->
|
|
<view class="white-bg">
|
|
<view class="report-list">
|
|
<view class="title">{{ item.cusName }}</view>
|
|
<view class="r-list">
|
|
<view class="r-name">{{ item.visistCode }}</view>
|
|
</view>
|
|
<view class="border-bottom b-width"></view>
|
|
<view class="r-list">
|
|
<view class="r-left">报告人</view>
|
|
<view class="r-right">{{ item.staffName }}</view>
|
|
</view>
|
|
<view class="border-bottom b-width"></view>
|
|
<view class="r-list">
|
|
<view class="r-left">走访日期</view>
|
|
<view class="r-right">{{ item.visistDate }}</view>
|
|
</view>
|
|
<view class="border-bottom b-width"></view>
|
|
<view class="r-list">
|
|
<view class="r-left">是否双方高层领导参与</view>
|
|
<view class="r-right">{{ item.whetherHaveLeader }}</view>
|
|
</view>
|
|
<view class="border-bottom b-width"></view>
|
|
<view class="r-list">
|
|
<view class="r-left">活动类型</view>
|
|
<view class="r-right">{{ item.visistType }}</view>
|
|
</view>
|
|
<view class="border-bottom b-width"></view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 报告明细&评论 -->
|
|
<customTabs v-model="activeTab" :tabs="tabList" :modelValue="activeTab">
|
|
<!-- 报告明细 -->
|
|
<block v-if="activeTab === 0">
|
|
<view class="white-bg white-bg-2" v-for="item in detailList">
|
|
<view class="report-list">
|
|
<view class="r-list">
|
|
<view class="r-left">拜访事项</view>
|
|
<view class="r-right">{{ item.detailType }}</view>
|
|
</view>
|
|
<view class="border-bottom b-width"></view>
|
|
<view class="r-list">
|
|
<view class="r-left">拜访类型</view>
|
|
<view class="r-right">{{ item.treeName }}</view>
|
|
</view>
|
|
<view class="border-bottom b-width"></view>
|
|
<view class="r-list">
|
|
<view class="r-left">客户人员</view>
|
|
<view class="r-right">{{ item.customerPersonnel }}</view>
|
|
</view>
|
|
<view class="border-bottom b-width"></view>
|
|
<view class="r-list">
|
|
<view class="r-left">我方人员</view>
|
|
<view class="r-right">{{ item.ourPersonnel }}</view>
|
|
</view>
|
|
<view class="border-bottom b-width"></view>
|
|
<view class="r-list" style="display: block">
|
|
<view class="r-name">结果</view>
|
|
<view class="r-gray">
|
|
<view>
|
|
{{ item.bandResult }} </view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</block>
|
|
</customTabs>
|
|
|
|
|
|
<view class="tipsPopBtn">
|
|
<view class="btnCancal" @click="refuse">驳回</view>
|
|
<!-- <view class="btnComfire" @click="refusePass">通过不得分</view> -->
|
|
<view class="btnComfire" @click="adopt(item)">通过</view>
|
|
|
|
</view>
|
|
<!-- 底部加高度来避免tabbar遮挡 -->
|
|
<view class="bottom-height"></view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref } from 'vue'
|
|
import { onLoad } from '@dcloudio/uni-app'
|
|
import customHeader from '@/components/customHeader.vue'
|
|
import customTabs from '@/components/customTabs.vue';
|
|
import {
|
|
auditActivityReport,
|
|
getRejectReason,
|
|
getVisistDetailList,
|
|
getYsVisistInfo
|
|
} from '../../../../api/crm/activity/activity';
|
|
|
|
|
|
let visistId = ref(0)
|
|
// 加载后调用
|
|
let id = ref(null)
|
|
onLoad((options) => {
|
|
visistId.value = options.visistId
|
|
getVisitorReportDetail();
|
|
})
|
|
|
|
|
|
// 查询详情
|
|
let item = ref({});
|
|
//明细List
|
|
let detailList = ref([])
|
|
const getVisitorReportDetail = async () => {
|
|
let param = {
|
|
visistId: visistId.value
|
|
}
|
|
|
|
let res = await getYsVisistInfo(param);
|
|
item.value = res.data;
|
|
let detailRes = await getVisistDetailList(param);
|
|
detailList.value = detailRes.rows;
|
|
}
|
|
|
|
// 报告明细&评论
|
|
const activeTab = ref(0);//默认报告明细
|
|
const tabList = ['报告明细'];
|
|
|
|
//点击驳回
|
|
// 修正后的驳回方法
|
|
const refuse = async () => {
|
|
uni.showModal({
|
|
title: '驳回原因',
|
|
content: '',
|
|
editable: true,
|
|
success: async function (modalRes) { // 使用modalRes避免重名
|
|
if (modalRes.confirm) {
|
|
try {
|
|
const param = {
|
|
visistId: visistId.value,
|
|
rejectReason: modalRes.content // 用户输入的驳回原因
|
|
};
|
|
const apiRes = await getRejectReason(param); // 避免与modalRes重名
|
|
uni.showToast({
|
|
title: '驳回成功',
|
|
icon: 'success'
|
|
});
|
|
// 操作完成后返回
|
|
setTimeout(() => {
|
|
uni.navigateBack(1);
|
|
}, 800);
|
|
} catch (err) {
|
|
console.log('驳回失败:', err);
|
|
uni.showToast({
|
|
title: '驳回失败',
|
|
icon: 'error'
|
|
});
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
//点击通过
|
|
function adopt(item) {
|
|
uni.showModal({
|
|
title: '提交',
|
|
content: '是否要通过本报告？',
|
|
success: function (res) {
|
|
if (res.confirm) {
|
|
auditActivityReport({
|
|
activityId: item.visistId,
|
|
reportStaffName: item.staffName,
|
|
}).then(res => {
|
|
if (res.code == 200) {
|
|
mescroll.resetUpScroll()
|
|
} else {
|
|
uni.showToast({
|
|
icon: 'none',
|
|
title: res.msg,
|
|
});
|
|
}
|
|
})
|
|
|
|
uni.navigateBack({
|
|
})
|
|
|
|
}
|
|
}
|
|
|
|
})
|
|
}
|
|
|
|
</script>
|
|
|
|
<style scoped>
|
|
.white-bg {
|
|
width: 690rpx;
|
|
margin: 0;
|
|
border-radius: 8px 8px 0 0;
|
|
}
|
|
|
|
.white-bg.white-bg-2 {
|
|
border-radius: 0;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
:deep(.tabs-header) {
|
|
/* background: none !important; */
|
|
border-bottom: none !important;
|
|
margin: 0 auto;
|
|
gap: 5px;
|
|
}
|
|
|
|
:deep(.tab-item) {
|
|
color: #919191;
|
|
font-size: 32rpx;
|
|
font-weight: bold;
|
|
/* flex:none; */
|
|
/* margin: 0 -50rpx; */
|
|
/* padding: 0 50rpx; */
|
|
}
|
|
|
|
:deep(.tab-item:first-child) {
|
|
text-align: right;
|
|
margin-left: 230rpx;
|
|
}
|
|
|
|
:deep(.tab-item:last-child) {
|
|
text-align: left;
|
|
margin-right: 230rpx;
|
|
}
|
|
|
|
:deep(.tab-item.active) {
|
|
color: #3384DF;
|
|
font-weight: bold;
|
|
}
|
|
|
|
:deep(.tab-item.active::after) {
|
|
width: 100rpx;
|
|
height: 8rpx;
|
|
}
|
|
|
|
|
|
.tipsPopBtn {
|
|
width: 370px;
|
|
height: 80px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin: 50px auto 56px auto;
|
|
bottom: 0;
|
|
left: 0;
|
|
}
|
|
|
|
.btnCancal {
|
|
width: 100px;
|
|
height: 60px;
|
|
border: 2px solid #29abe2;
|
|
border-radius: 40px;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
color: #29abe2;
|
|
font-size: 15px;
|
|
|
|
}
|
|
|
|
.btnComfire {
|
|
width: 100px;
|
|
height: 60px;
|
|
background-color: #29abe2;
|
|
border-radius: 40px;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
color: #FFF;
|
|
font-size: 15px;
|
|
}
|
|
</style>
|