@@ -1,400 +1,201 @@
< template >
< AppLayout :title = "title" :show-bg-image = "false" >
< view class = "info-box " >
< view class = "info -item info-line" >
< image class = "info-img" :src = "baseUrl+'/dispatch/person-icon.png'" mode = "" > < / image >
< view class = "info-label" >
人员姓名
< / view >
< view class = "info-value" >
{ { personInfo . name } }
< / view >
< / view >
< view class = "info-item" >
< image class = "info-img" :src = "baseUrl+'/dispatch/help-icon.png'" mode = "" > < / image >
< view class = "info-label" >
帮扶类型
< / view >
< view class = "info-value" >
{ { personInfo . taskType } }
< / view >
< / view >
< AppLayout :title = "title" :show-bg-image = "false" >
< view class = "tab-container " >
< view class = "tab -item" : class = "{ active: currentTab === 'train' }" @click ="switchTab('train')" >
培训公告
< / view >
< view class = "main-list" :style = "getBackgroundStyle('k.png ')" >
< view class = "list-top" >
< view class = "list-title" >
< text > 新增跟进记录 < / text >
< view class = "title-line" > < / view >
< / view >
< / view >
< view class = "form-container" >
< uni-forms ref = "formRef" v-model = "formData" :rules="rules" validate-trigger="submit" >
<!-- 跟进日期 -- >
< uni-forms-item label = "跟进日期:" name = "followDate" required >
< uni-datetime-picker class = "picker-value" type = "date" placeholder = "请选择跟进日期" v-model = "formData.followDate" @change="onFollowDateChange" / >
< / uni-forms-item >
<!-- 跟进方式 -- >
< uni-forms-item label = "跟进方式:" name = "followWay" required >
< uni-data-select v-model = "formData.followWay" placeholder="请选择跟进方式" :localdata="followWays" @change="onMethodChange" > < / uni -data -select >
< / uni-forms-item >
<!-- 跟进内容 -- >
< uni-forms-item label = "跟进内容:" name = "content" required >
< uni-easyinput type = "textarea" v-model = "formData.content" placeholder="请输入跟进内容" > < / uni -easyinput >
< / uni-forms-item >
<!-- 跟进结果 -- >
< uni-forms-item label = "跟进结果:" name = "result" required >
< uni-easyinput type = "textarea" v-model = "formData.result" placeholder="请输入跟进结果" > < / uni -easyinput >
< / uni-forms-item >
<!-- 下一步计划 -- >
< uni-forms-item label = "下一步计划:" name = "nextPlan" >
< uni-easyinput type = "textarea" v-model = "formData.nextPlan" placeholder="请输入下一步计划(可选)" > < / uni -easyinput >
< / uni-forms-item >
<!-- 下次联系时间 -- >
< uni-forms-item label = "下次联系:" name = "nextContactDate" >
< uni-datetime-picker class = "picker-value" type = "date" placeholder = "请选择跟进日期" v-model = "formData.nextContactDate" @change="onDateChange" / >
< / uni-forms-item >
< / uni-forms >
<!-- 按钮组 -- >
< view class = "button-group" >
< button class = "btn submit-btn" @click ="handleSubmit" > 保存跟进 < / button >
< button class = "btn reset-btn" @click ="handleReset" > 重置 < / button >
< / view >
< / view >
< / view >
< view class = "main-list" :style = "getBackgroundStyle('k.png')" >
< view class = "list-top" >
< view class = "list-title" >
< text > 跟进历史记录 < / text >
< view class = "title-line" > < / view >
< / view >
< view class = "title-total" >
共 < text class = "total-num" > { { followListNum } } < / text > 条记录
< / view >
< / view >
< view class = "list-box" v-if = "followListNum>0" >
< uni -steps :options = "followList" active -color = " # 007AFF " :active = "active" direction = "column" / >
< / view >
< empty v-else pdTop = "200" > < / empty >
< view class = "tab-item" : class = "{ active: currentTab === 'evaluate' }" @click ="switchTab('evaluate ')" >
评价公告
< / view >
< / AppLayout >
< / view >
< scroll -view scroll -y class = "main-scroll" @scrolltolower ="handleScrollToLower" >
< view class = "main-list" >
< view
:style = "getBackgroundStyle('frame-activity.png')"
class = "policy-list"
v-for = "(item, index) in policyList"
:key = "index"
@click ="goPolicyDetail(item)" >
< view class = "title" >
{ { item . title } }
< / view >
< view class = "bottom-line" >
< view >
< uni-icons color = "#A2A2A2" type = "info" size = "12" > < / uni-icons >
发布日期 : { { item . publishTime } }
< / view >
< / view >
< view >
< view class = "gk-l-i-bottom" v-html = "item.content" > < / view >
< / view >
< / view >
< / view >
< / scroll -view >
< / AppLayout >
< / template >
< script setup >
import { inject , ref , reactive } from ' vue' ;
impor t { onLoad } from '@dcloudio/uni-app' ;
const { $api , navTo , navBack } = inject ( 'globalFunction' ) ;
import config from "@/config.js"
import { inject , ref , reactive , onMounted } from " vue" ;
cons t { $api , navTo , navBack , vacanciesTo } = inject ( "globalFunction" ) ;
import config from "@/config.js" ;
import AppLayout from "@/components/AppLayout/AppLayout.vue" ;
const title = ref ( "" ) ;
const baseUrl = config . imgBaseUrl ;
const pageSize = ref ( 10 )
const pageNum = ref ( 1 )
const totalNum = ref ( 0 )
// Tab 控制
const currentTab = ref ( "train" ) ; // 默认显示培训公告
const title = ref ( '' ) ;
const formData = reactive ( {
goalPersonId : '' ,
followDate : '' ,
followWay : '' ,
content : '' ,
result : '' ,
nextPlan : '' ,
nextContactDate : ''
} )
const personInfo = ref ( {
goalPersonId : '' ,
name : '' ,
taskType : '' ,
task _id : ''
} )
const followWays = ref ( [ ] )
const followList = ref ( [ ] )
const followListNum = ref ( 0 )
const active = ref ( null )
// 表单引用
const formRef = ref ( null )
// 校验规则
const rules = {
followDate : {
rules : [ {
required : true ,
errorMessage : '请选择跟进日期'
} ]
} ,
followWay : {
rules : [ {
required : true ,
errorMessage : '请选择跟进方式'
} ]
} ,
content : {
rules : [ {
required : true ,
errorMessage : '请填写跟进内容'
} ]
} ,
result : {
rules : [ {
required : true ,
errorMessage : '请填写跟进结果'
} ]
}
function switchTab ( tabName ) {
currentTab . value = tabName ;
getPolicyData ( 'refresh' , currentTab )
}
const baseUrl = config . imgBaseUrl
const handleScrollToLower = ( ) => {
getPolicyData ( 'add' , currentTab ) ;
} ;
const getBackgroundStyle = ( imageName ) => ( {
backgroundImage : ` url( ${ baseUrl } /dispatch/ ${ imageName } ) ` ,
backgroundSize : 'cover' , // 覆盖整个容器
backgroundPosition : ' center' , // 居中
backgroundRepeat : ' no-repeat'
backgroundImage : ` url( ${ baseUrl } / ${ imageName } ) ` ,
backgroundSize : "100% 100%" , // 覆盖整个容器
backgroundPosition : " center" , // 居中
backgroundRepeat : " no-repeat" ,
} ) ;
const onFollowDateChange = ( e ) => {
formData . followDate = e
}
const onMethodChange = ( e ) => {
formData . followWay = e
}
// 事件处理
const onDateChang e = ( e ) => {
formData . nextContactDat e = e
}
function getFollowList ( ) {
let header = {
'Authorization' : uni . getStorageSync ( 'fourLevelLinkage-token' ) ,
'Content-Type' : "application/x-www-form-urlencoded"
onMounted ( ( ) => {
getPolicyData ( 'refresh' , currentTab ) ;
} ) ;
const policyList = ref ( [ ] ) ;
function getPolicyData ( type = 'add' , currentTab = 'train' ) {
let current = ref ( '1' )
if ( currentTab . value == 'train' ) {
current . value = '1'
} else if ( currentTab . valu e == 'evaluate' ) {
current . valu e = '2'
}
let params = {
personId : personInfo . value . person _id ,
taskId : personInfo . value . task _id
}
$api . myRequest ( '/dispatch/assist/records/getFollowList' , params , 'get' , 9100 , header ) . then ( ( resData ) => {
console . log ( "resData" , resData )
if ( resData && resData . code == 200 ) {
if ( resData . data && resData . data . length > 0 ) {
followListNum . value = resData . data . length
resData . data . forEach ( item => {
const obj = {
title : item . followDate ,
desc : ` 跟进方式: ${ getFollowWaysLabelByValue ( item . followWay ) } \ n跟进人: ${ item . createByName } \ n跟进内容: ${ item . content } `
}
followList . value . push ( obj )
} )
}
let maxPage = Math . ceil ( totalNum . value / pageSize . value )
let params = { }
if ( type === 'refresh' ) {
pageNum . value = 1 ;
params = {
pageSize : pageSize . value ,
pageNum : pageNum . value ,
type : current . value
}
} ) ;
}
function getDictionary ( ) {
$api . myRequest ( '/system/public/dict/data/type/assist_follow_way' ) . then ( ( resData ) => {
if ( resData && resData . code == 200 ) {
resData . data . forEach ( item => {
const obj = {
value : item . dictValue ,
text : item . dictLabel
$api . myRequest ( '/train/public/announcement/list' , params ) . then ( ( resData ) => {
if ( resData . code == 200 ) {
for ( var i = 0 ; i < resData .rows.length ; i + + ) {
resData.rows [ i ] .content = resData.rows [ i ] .content.replace ( / < [ ^ > ] + > / g , " " ) ;
}
f ollowWays . value . push ( obj )
} )
}
} ) ;
}
function getFollowWaysLabelByValue ( value ) {
if ( ! Array . isArray ( followWays . value ) ) {
return ''
}
const item = followWays . value . find ( item => item . value === String ( value ) )
return item ? item . text : '暂无跟进方式'
}
const handleSubmit = ( ) => {
formRef . value ? . validate ( )
. then ( ( ) => {
let header = {
'Authorization' : uni . getStorageSync ( 'fourLevelLinkage-token' )
}
formData . goalPersonId = personInfo . value . goalPersonId
$api . myRequest ( '/dispatch/assist/records/addRecords' , formData , 'post' , 9100 , header ) . then ( ( resData ) => {
console . log ( "resData" , resData )
if ( resData && resData . code == 200 ) {
handleReset ( )
uni . showToast ( {
title : '保存成功' ,
icon : 'success' ,
duration : 2000
} ) ;
} else {
uni . showToast ( {
title : resData . msg ,
icon : 'none' ,
duration : 2000
} ) ;
p olicyList . value = resData . rows
totalNum . value = resData . total
}
} ) ;
} )
. catch ( ( errors ) => {
console . log ( '校验失败:' , errors ) ;
} ) ;
} ;
const handleReset = ( ) => {
formData . followDate = '' ;
formData . followWay = '' ;
formData . content = '' ;
formData . result = '' ;
formData . nextPlan = '' ;
formData . nextContactDate = '' ;
}
if ( type === 'add' && pageNum . value < maxPage ) {
pageNum . value += 1 ;
params = {
pageSize : pageSize . value ,
pageNum : pageNum . value ,
type : current . value
}
$api . myRequest ( '/train/public/announcement/list' , params ) . then ( ( resData ) => {
if ( resData . code == 200 ) {
for ( var i = 0 ; i < resData .rows.length ; i + + ) {
resData.rows [ i ] .content = resData.rows [ i ] .content.replace ( / < [ ^ > ] + > / g , " " ) ;
}
policyList . value = policyList . value . concat ( resData . rows )
totalNum . value = resData . total
}
} ) ;
}
}
onLoad ( ( options ) => {
personInfo . value . person _id = options . person _id
personInfo . value . name = options . name
personInfo . value . taskType = options . taskType
personInfo . value . task _id = options . task _id
getDictionary ( )
getFollowList ( )
} ) ;
function goPolicyDetail ( item ) {
uni . navigateTo ( {
url : ` /packageB/notice/detail?id= ${ item . id } `
// url: `/packageRc/pages/policy/policyDetail?id=${item.id}`
} ) ;
}
< / script >
< style lang = "stylu s" scoped >
image
height : 100 %
width : 100 %
. info - box
margin : 30 rpx 30 rpx
background : linear - gradient ( 0 deg , # D9ECFF 0 % , # F0F7FF 100 % )
border - radius : 20 rpx
padding : 40 rpx 0
display : flex
align - items : center
. info - img
width : 40 rpx
height : 40 rpx
margin - bottom : 20 rpx
. info - line
border - right : 2 rpx solid # B7D6FF
. info - item
display : flex
flex - direction : column
align - items : center
justify - content : center
width : 50 %
. info - label
font - size : 26 rpx
color : # 6 E7E9B
margin - bottom : 20 rpx
. info - value
font - weight : bold
font - size : 28 rpx
color : # 3 D61AC
. main - list
background - color : # ffffff
padding : 20 rpx 20 rpx 28 rpx 20 rpx
margin : 30 rpx 30 rpx
box - shadow : 0 px 3 px 20 px 0 px rgba ( 0 , 105 , 234 , 0.1 )
border - radius : 12 px
. list - top
display : flex
align - items : center
justify - content : space - between
. list - title
font - weight : bold
font - size : 36 rpx
color : # 404040
position : relative
. title - line
position : absolute
bottom : - 10 rpx
left : 70 rpx
width : 70 rpx
height : 8 rpx
background : linear - gradient ( 90 deg , # FFAD58 0 % , # FF7A5B 100 % )
border - radius : 4 rpx
. title - total
font - size : 24 rpx
color : # 999999
. total - num
color : # 3088 FF
margin - left : 4 rpx
margin - right : 4 rpx
font - weight : bold
font - size : 26 rpx
. label
width : 160 rpx
font - size : 28 rpx
color : # 404040
. input ,
. picker
flex : 1
. picker - value
color : # 666
. list - box
margin - top : 40 rpx
. form - container
margin - top : 30 rpx
: deep ( . uni - forms - item _ _label )
width : 194 rpx ! important
font - size : 28 rpx ;
color : # 404040 ;
. button - group {
< style lang = "scs s" scoped >
. main - list {
// background-color: #ffffff;
// padding: 20rpx 25rpx 28rpx 25rpx;
margin : 0 30 rpx 30 rpx 30 rpx ;
// box-shadow: 0px 3px 20px 0px rgba(0, 105, 234, 0.1);
// border-radius: 12px;
}
. tab - container {
display : flex ;
justify - content : space - between ;
padding : 40 rpx 20 rpx 20 rpx ;
}
. btn {
width : 45 % ;
height : 80 rpx ;
font - size : 30 rpx ;
border - radius : 8 rpx ;
background - color : # fff ;
margin : 0 30 rpx 20 rpx ;
border - radius : 12 rpx ;
overflow : hidden ;
margin - top : 10 rpx ;
}
. reset - btn {
background - color : # D8E9FF ;
color : # 1176 FF ;
. tab - item {
flex : 1 ;
display : flex ;
align - items : center ;
justify - content : center ;
font - size : 32 rpx ;
color : # 666 ;
transition : all 0.3 s ;
}
. submit - btn {
background - color : # 368 BFF ;
color : white ;
. tab - item . active {
background - color : # ffffff ;
color : # 4 c6efb ;
font - weight : bold ;
// box-shadow: 0 4rpx 10rpx rgba(0, 0, 0, 0.05);
border - bottom : 2 rpx solid # 4 c6efb ;
}
. gk - l - i - bottom {
margin - top : 16 px ;
overflow : hidden ;
text - overflow : ellipsis ;
display : - webkit - box ;
- webkit - line - clamp : 3 ;
- webkit - box - orient : vertical ;
}
. main - scroll {
width : 100 % ;
height : 90 % ;
}
. policy - list {
width : 100 % ;
margin : 0 auto ;
color : # 333333 ;
border - radius : 24 rpx ;
background : # ffffff ;
margin - bottom : 24 rpx ;
padding : 28 rpx 22 rpx ;
box - sizing : border - box ;
position : relative ;
. title {
font - size : 32 rpx ;
font - weight : bold ;
color : # 282828 ;
margin - bottom : 16 rpx ;
display : flex ;
}
. bottom - line {
display : flex ;
justify - content : space - between ;
font - size : 24 rpx ;
color : # a2a2a2 ;
margin - top : 12 rpx ;
}
}
: deep ( . uni - steps _ _column - circle )
width : 24 rpx ! important
height : 24 rpx ! important
background : radial - gradient ( circle ,
# 00 C0FA 0 % ,
# 015 EEA 50 % ,
# FFFFFF 51 % ,
# FFFFFF 100 % ) ! important
border - radius : 50 %
border : 2 rpx solid # 015 EEA
: deep ( . uni - steps _ _column - title )
font - size : 28 rpx ! important
color : # 006 CFF ! important
margin - bottom : 24 rpx
: deep ( . uni - steps _ _column - desc )
font - size : 28 rpx
color : # 898989 ! important
line - height : 1.5
: deep ( . uni - steps _ _column - text )
padding : 16 rpx 0 ! important
border : none
: deep ( . uni - steps _ _column - line )
background - color : # 368 BFF ! important
: deep ( . uni - steps _ _column - line -- before )
background - color : rgba ( 0 , 0 , 0 , 0 ) ! important
: deep ( . uni - date - x )
background : rgba ( 0 , 0 , 0 , 0 ) ! important
: deep ( . uni - stat - box )
background : rgba ( 0 , 0 , 0 , 0 ) ! important
: deep ( . uni - easyinput _ _content )
background : rgba ( 0 , 0 , 0 , 0 ) ! important
< / style >