Files
ks-app-employment-service/packageB/priority/allocate.vue
2026-02-11 17:16:17 +08:00

359 lines
9.0 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<AppLayout :title="title" :show-bg-image="false" >
<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="taskName" required >
<uni-easyinput v-model="formData.taskName" placeholder="请输入任务名称"></uni-easyinput>
</uni-forms-item>
<uni-forms-item label="目标人员:" name="priority" required >
<uni-data-select v-model="formData.priority" placeholder="请选择目标人员" :localdata="followWays" @change="onMethodChange"></uni-data-select>
</uni-forms-item>
<uni-forms-item label="目标人数:" name="content" required>
<uni-easyinput v-model="formData.taskAllocation.goalPersonCount" placeholder="请输入目标人数"></uni-easyinput>
</uni-forms-item>
<uni-forms-item label="执行区域:" name="executeDeptId" required >
<uni-data-select v-model="formData.taskAllocation.executeDeptId" placeholder="请选择执行区域" :localdata="followWays" @change="onMethodChange"></uni-data-select>
</uni-forms-item>
<uni-forms-item label="分配说明:" name="allocationNote" required>
<uni-easyinput type="textarea" v-model="formData.taskAllocation.allocationNote" placeholder="请输入分配说明"></uni-easyinput>
</uni-forms-item>
<uni-forms-item label="截止时间:" name="deadline" >
<uni-datetime-picker class="picker-value" type="date" placeholder="请选择截止时间" v-model="formData.taskAllocation.deadline" @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>
</AppLayout>
</template>
<script setup>
import { inject, ref, reactive } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
const { $api, navTo, navBack } = inject('globalFunction');
import config from "@/config.js"
const title = ref('');
const formData = reactive({
taskName: '',
taskType: '',
priority: '',
taskAllocation: {
goalPersonCount: null,
executeDeptId: '',
executeDeptName: '',
executeDeptAncestors: '',
allocationStatus: '1',
allocationNote: '',
deadline: null,
goalPersonList: []
}
})
const personInfo=ref({
goalPersonId:'',
name:'',
taskType:'',
task_id:''
})
const followWays = ref([])
const followList = ref([])
const followListNum=ref(0)
// 表单引用
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: '请填写跟进结果'
}]
}
}
const baseUrl = config.imgBaseUrl
const getBackgroundStyle = (imageName) => ({
backgroundImage: `url(${baseUrl}/dispatch/${imageName})`,
backgroundSize: 'cover', // 覆盖整个容器
backgroundPosition: 'center', // 居中
backgroundRepeat: 'no-repeat'
});
const onFollowDateChange = (e)=>{
formData.followDate=e
}
const onMethodChange = (e) => {
formData.followWay=e
}
// 事件处理
const onDateChange = ( e) => {
formData.nextContactDate=e
}
function getFollowList(){
let header={
'Authorization':uni.getStorageSync('fourLevelLinkage-token'),
'Content-Type': "application/x-www-form-urlencoded"
}
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)
})
}
}
});
}
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
}
followWays.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
});
}
});
})
.catch((errors) => {
console.log('校验失败:', errors);
});
};
const handleReset = () => {
formData.followDate = '';
formData.followWay = '';
formData.content = '';
formData.result = '';
formData.nextPlan = '';
formData.nextContactDate = '';
}
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()
});
</script>
<style lang="stylus" scoped>
image
height: 100%
width: 100%
.info-box
margin: 30rpx 30rpx
background: linear-gradient(0deg, #D9ECFF 0%, #F0F7FF 100%)
border-radius: 20rpx
padding: 40rpx 0
display: flex
align-items: center
.info-img
width: 40rpx
height: 40rpx
margin-bottom: 20rpx
.info-line
border-right: 2rpx solid #B7D6FF
.info-item
display: flex
flex-direction: column
align-items: center
justify-content: center
width: 50%
.info-label
font-size: 26rpx
color: #6E7E9B
margin-bottom: 20rpx
.info-value
font-weight: bold
font-size: 28rpx
color: #3D61AC
.main-list
background-color: #ffffff
padding: 20rpx 20rpx 28rpx 20rpx
margin: 30rpx 30rpx
box-shadow: 0px 3px 20px 0px rgba(0,105,234,0.1)
border-radius: 12px
.list-top
display: flex
align-items: center
justify-content: space-between
.list-title
font-weight: bold
font-size: 36rpx
color: #404040
position: relative
.title-line
position: absolute
bottom: -10rpx
left: 70rpx
width: 70rpx
height: 8rpx
background: linear-gradient(90deg, #FFAD58 0%, #FF7A5B 100%)
border-radius: 4rpx
.title-total
font-size: 24rpx
color: #999999
.total-num
color: #3088FF
margin-left: 4rpx
margin-right: 4rpx
font-weight: bold
font-size: 26rpx
.label
width: 160rpx
font-size: 28rpx
color: #404040
.input,
.picker
flex: 1
.picker-value
color: #666
.list-box
margin-top: 40rpx
.form-container
margin-top: 30rpx
:deep(.uni-forms-item__label)
width: 194rpx !important
font-size: 28rpx;
color: #404040;
.button-group {
display: flex;
justify-content: space-between;
padding: 40rpx 20rpx 20rpx;
}
.btn {
width: 45%;
height: 80rpx;
font-size: 30rpx;
border-radius: 8rpx;
}
.reset-btn {
background-color: #D8E9FF;
color: #1176FF;
}
.submit-btn {
background-color: #368BFF;
color: white;
}
:deep(.uni-steps__column-circle )
width: 24rpx !important
height: 24rpx !important
background: radial-gradient(circle,
#00C0FA 0%,
#015EEA 50%,
#FFFFFF 51%,
#FFFFFF 100%) !important
border-radius: 50%
border: 2rpx solid #015EEA
:deep(.uni-steps__column-title)
font-size: 28rpx !important
color: #006CFF !important
margin-bottom: 24rpx
:deep(.uni-steps__column-desc)
font-size: 28rpx
color: #898989 !important
line-height: 1.5
:deep(.uni-steps__column-text )
padding: 16rpx 0 !important
border: none
:deep(.uni-steps__column-line)
background-color: #368BFF !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>