190 lines
7.3 KiB
Vue
190 lines
7.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.title }}</view>
|
||
<view class="r-list">
|
||
<view class="r-name">{{ item.name }}</view>
|
||
<view class="r-right btn-pink" size="mini" @click="handleZan">
|
||
<uni-icons type="hand-up-filled" size="16" color="#ffffff"></uni-icons> 赞
|
||
</view>
|
||
</view>
|
||
<view class="border-bottom b-width"></view>
|
||
<view class="r-list">
|
||
<view class="r-left">报告人</view>
|
||
<view class="r-right">{{ item.reportPeople }}</view>
|
||
</view>
|
||
<view class="border-bottom b-width"></view>
|
||
<view class="r-list">
|
||
<view class="r-left">走访日期</view>
|
||
<view class="r-right">{{ item.dateStr }}</view>
|
||
</view>
|
||
<view class="border-bottom b-width"></view>
|
||
<view class="r-list">
|
||
<view class="r-left">是否双方高层领导参与</view>
|
||
<view class="r-right">{{ item.isJoin }}</view>
|
||
</view>
|
||
<view class="border-bottom b-width"></view>
|
||
<view class="r-list">
|
||
<view class="r-left">活动类型</view>
|
||
<view class="r-right">{{ item.activityTypeName }}</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">
|
||
<view class="report-list">
|
||
<view class="r-list">
|
||
<view class="r-left">拜访事项</view>
|
||
<view class="r-right">获得信息</view>
|
||
</view>
|
||
<view class="border-bottom b-width"></view>
|
||
<view class="r-list">
|
||
<view class="r-left">拜访类型</view>
|
||
<view class="r-right">竞争对手信息</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">考察了几家连接器单位，陶瓷管壳55所、43所现在的开模费有所下降，便宜的几千块钱。</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="white-bg white-bg-2">
|
||
<view class="report-list">
|
||
<view class="r-list">
|
||
<view class="r-left">拜访事项</view>
|
||
<view class="r-right">日常走访</view>
|
||
</view>
|
||
<view class="border-bottom b-width"></view>
|
||
<view class="r-list">
|
||
<view class="r-left">拜访类型</view>
|
||
<view class="r-right">竞争对手信息</view>
|
||
</view>
|
||
<view class="border-bottom b-width"></view>
|
||
<view class="r-list">
|
||
<view class="r-left">客户人员</view>
|
||
<view class="r-right">孙琳琳、顾鹏、田玲</view>
|
||
</view>
|
||
<view class="border-bottom b-width"></view>
|
||
<view class="r-list">
|
||
<view class="r-left">我方人员</view>
|
||
<view class="r-right">肖建华、石宪、刘启运、赵震</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 class="margin-bottom20" >1、江苏屹信现在有意向寻找第二家管壳供方，主要是因为客户要求做一些封装产品和自研顶目涉及到SIP系统级封装研发工作。 </view>
|
||
<view>2、江苏屹信管壳主要是功放管壳带热沉/CPC/钨铜/钼铜。陶瓷管壳希望在30天内交付。</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</block>
|
||
<!-- 评论 -->
|
||
<block v-if="activeTab === 1">
|
||
<view class="white-bg white-bg-2">评论内容</view>
|
||
</block>
|
||
</customTabs>
|
||
|
||
|
||
|
||
<!-- 底部加高度来避免tabbar遮挡 -->
|
||
<view class="bottom-height"></view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref, onMounted } from 'vue'
|
||
import { onLoad } from '@dcloudio/uni-app'
|
||
import customHeader from '@/components/customHeader.vue'
|
||
import customTabs from '@/components/customTabs.vue';
|
||
import { visitorReportDetail } from '@/api/business.js'
|
||
|
||
|
||
// 加载后调用
|
||
let id = ref(null)
|
||
onLoad((options) => {
|
||
id.value = options.id;
|
||
getVisitorReportDetail();
|
||
})
|
||
|
||
// 查询详情
|
||
let item = ref({});
|
||
const getVisitorReportDetail = async () => {
|
||
let param = {
|
||
id: id.value
|
||
}
|
||
let res = await visitorReportDetail(param);
|
||
item.value = res.activeObj;
|
||
}
|
||
|
||
// 报告明细&评论
|
||
const activeTab = ref(0);//默认报告明细
|
||
const tabList = ['报告明细', '评论'];
|
||
|
||
// 跳转走访报告录入
|
||
let handleZan = ()=>{
|
||
|
||
}
|
||
|
||
</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;
|
||
}
|
||
|
||
</style> |