297 lines
8.1 KiB
Vue
297 lines
8.1 KiB
Vue
<template>
|
||
<uni-forms ref="formRef" :model="formData" :rules="rules" label-width="100px" label-position="top">
|
||
<uni-forms-item label="客户人员" name="customerUserList" class="f-c-right">
|
||
<uni-easyinput v-model="formData.customerUserList" placeholder="请选择客户人员" name="input" :disabled="isDisabled"
|
||
@focus="chooseClientUser"></uni-easyinput>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="我方参与人" name="myUserList" class="f-c-right">
|
||
<uni-easyinput v-model="formData.myUserList" placeholder="请选择我方参与人" name="input" :disabled="isDisabled"
|
||
@focus="chooseMyUser"></uni-easyinput>
|
||
</uni-forms-item>
|
||
|
||
<uni-forms-item label="活动内容" name="activityTypeList" class="f-c-right">
|
||
<uni-easyinput v-model="formData.activityTypeList" placeholder="请选择活动内容" name="input"
|
||
@focus="chooseActivityType"></uni-easyinput>
|
||
</uni-forms-item>
|
||
|
||
<uni-forms-item label="活动文字" name="activeTxt" class="uni-forms-item is-direction-top is-top">
|
||
<uni-easyinput type="textarea" autoHeight v-model="formData.activeTxt" placeholder="请输入" 活动文字
|
||
class="form-texarea" />
|
||
</uni-forms-item>
|
||
</uni-forms>
|
||
<view class="footer-con">
|
||
<button class="btn-default" type="default" @click="handleDeleteVisistDetailItem" size="mini">删 除</button>
|
||
<button class="btn-primary" type="primary" @click="submitForm" size="mini">保存/修改</button>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup name="dailyVisitComponent">
|
||
import { ref, reactive } from 'vue'
|
||
import cache from '../../../../../utils/cache'
|
||
import { onShow, onUnload } from '@dcloudio/uni-app';
|
||
import { addVisistDetail, deleVisistDetailItem, getVisistDetailItem } from '../../../../../api/crm/activity/activity';
|
||
|
||
let customerUserList = ref([])
|
||
let myUserList = ref([])
|
||
let activityTypeList = ref([])
|
||
let activeTxt = ref([])
|
||
let isDisabled = ref(false)
|
||
const props = defineProps({
|
||
cusName: String, //客户单位名称
|
||
cusId: Number,//客户ID
|
||
visistId: Number,//活动ID
|
||
status: String //状态
|
||
})
|
||
|
||
// 表单数据
|
||
const formData = ref({
|
||
customerUserList,
|
||
myUserList,
|
||
activityTypeList,
|
||
activeTxt
|
||
});
|
||
|
||
// 验证规则
|
||
const rules = {
|
||
activityTypeList: {
|
||
rules: [
|
||
{ required: true, errorMessage: '请选择活动内容' }
|
||
]
|
||
}
|
||
|
||
};
|
||
|
||
// 表单ref
|
||
const formRef = ref(null);
|
||
|
||
//删除明细项的内容
|
||
let rcDeleteForm = reactive({})
|
||
function handleDeleteVisistDetailItem() {
|
||
rcDeleteForm.treeName = '日常走访'
|
||
rcDeleteForm.visistId = props.visistId
|
||
deleVisistDetailItem(rcDeleteForm).then(res => {
|
||
if (res.code == 200) {
|
||
uni.showToast({
|
||
title: '删除成功',
|
||
duration: 2000
|
||
});
|
||
//响应成功，删除缓存记录
|
||
handleDelete()
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
});
|
||
}
|
||
})
|
||
}
|
||
|
||
// 删除内容
|
||
let handleDelete = () => {
|
||
formData.value.customerUserList = null
|
||
formData.value.myUserList = null
|
||
formData.value.activityTypeList = null
|
||
formData.value.activeTxt = null
|
||
if (cache.get('checkedRCClientList') != null) {
|
||
cache.remove('checkedRCClientList');
|
||
}
|
||
if (cache.get('checkedRCMyUserList') != null) {
|
||
cache.remove('checkedRCMyUserList');
|
||
}
|
||
if (cache.get('checkedRCActivityTypeList') != null) {
|
||
cache.remove('checkedRCActivityTypeList');
|
||
}
|
||
}
|
||
|
||
//删除缓存
|
||
let handleDeleteLocal = () => {
|
||
cache.remove('checkedRCClientList');
|
||
cache.remove('checkedRCMyUserList');
|
||
cache.remove('checkedRCActivityTypeList');
|
||
}
|
||
|
||
let rcForm = reactive({})
|
||
// 保存/修改
|
||
const submitForm = async () => {
|
||
try {
|
||
// 验证表单
|
||
await formRef.value.validate();
|
||
// 验证通过后的操作
|
||
uni.showToast({
|
||
title: '验证通过',
|
||
icon: 'success'
|
||
});
|
||
rcForm.treeName = '日常走访'
|
||
rcForm.cusId = props.cusId
|
||
rcForm.visistId = props.visistId
|
||
if (Array.isArray(activityTypeList.value)) {
|
||
rcForm.activityTags = activityTypeList.value.join(',')
|
||
} else {
|
||
rcForm.activityTags = activityTypeList.value
|
||
}
|
||
|
||
if (Array.isArray(myUserList.value)) {
|
||
rcForm.ourPersonnel = myUserList.value.join(',')
|
||
} else {
|
||
rcForm.ourPersonnel = myUserList.value
|
||
}
|
||
|
||
if (Array.isArray(customerUserList.value)) {
|
||
rcForm.cusPersonnel = customerUserList.value.join(',')
|
||
} else {
|
||
rcForm.cusPersonnel = customerUserList.value
|
||
}
|
||
|
||
rcForm.bandResult = activeTxt.value
|
||
// 提交服务器进行新增
|
||
addVisistDetail(rcForm).then(res => {
|
||
if (res.code == 200) {
|
||
uni.showToast({
|
||
title: '提交成功',
|
||
duration: 2000
|
||
});
|
||
//响应成功，删除缓存记录
|
||
handleDeleteLocal()
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
});
|
||
}
|
||
})
|
||
} catch (err) {
|
||
console.log('表单验证失败:', err);
|
||
}
|
||
};
|
||
|
||
//页面渲染完成后，查询catch的get
|
||
onShow(() => {
|
||
|
||
if (cache.get('checkedRCClientList') != null && cache.get('checkedRCClientList') != []) {
|
||
customerUserList.value = cache.get('checkedRCClientList')
|
||
}
|
||
|
||
if (cache.get('checkedRCMyUserList') != null && cache.get('checkedRCMyUserList') != []) {
|
||
myUserList.value = cache.get('checkedRCMyUserList')
|
||
}
|
||
|
||
if (cache.get('checkedRCActivityTypeList') != null && cache.get('checkedRCActivityTypeList') != []) {
|
||
activityTypeList.value = cache.get('checkedRCActivityTypeList')
|
||
}
|
||
|
||
if (props.status == '完成') {
|
||
isDisabled.value = true
|
||
} else {
|
||
isDisabled.value = false
|
||
}
|
||
|
||
})
|
||
|
||
//查询日常走访的内容
|
||
let queryRCForm = reactive({})
|
||
let getRCVisitReportDetailContent = () => {
|
||
queryRCForm.visistId = props.visistId
|
||
queryRCForm.cusId = props.cusId
|
||
queryRCForm.treeName = '日常走访'
|
||
getVisistDetailItem(queryRCForm).then(res => {
|
||
if (res.rows[0] != null) {
|
||
customerUserList.value = res.rows[0].customerPersonnel
|
||
myUserList.value = res.rows[0].ourPersonnel
|
||
activityTypeList.value = res.rows[0].activityTags
|
||
activeTxt.value = res.rows[0].bandResult
|
||
}
|
||
})
|
||
}
|
||
|
||
|
||
|
||
//页面卸载之后，删除缓存信息
|
||
onUnload(() => {
|
||
handleDeleteLocal()
|
||
})
|
||
|
||
|
||
//选择客户人员
|
||
function chooseClientUser() {
|
||
uni.navigateTo({
|
||
url: '/pages/business/CRM/marketActivity/customerUserList?cusName=' + props.cusName + '&chooseType=日常走访'
|
||
})
|
||
}
|
||
|
||
//选择我方参与人
|
||
function chooseMyUser() {
|
||
uni.navigateTo({
|
||
url: '/pages/business/CRM/marketActivity/myUserList?chooseType=日常走访'
|
||
})
|
||
}
|
||
|
||
//选择活动类型
|
||
function chooseActivityType() {
|
||
uni.navigateTo({
|
||
url: '/pages/business/CRM/marketActivity/activityTypeList?chooseType=日常走访'
|
||
})
|
||
}
|
||
|
||
// 明确暴露给父组件的方法
|
||
defineExpose({
|
||
handleDelete,
|
||
getRCVisitReportDetailContent
|
||
})
|
||
|
||
</script>
|
||
|
||
|
||
<style scoped lang="scss">
|
||
.all-body {
|
||
/* #ifdef APP-PLUS */
|
||
top: 150rpx;
|
||
height: calc(100vh - 75px);
|
||
/* #endif */
|
||
/* #ifndef APP-PLUS */
|
||
top: 120rpx;
|
||
height: calc(100vh);
|
||
/* #endif */
|
||
}
|
||
|
||
.search {
|
||
display: flex;
|
||
}
|
||
|
||
.search .btn-search {
|
||
border: none;
|
||
background: none;
|
||
line-height: normal;
|
||
color: #fff;
|
||
line-height: 56rpx !important;
|
||
padding: 10rpx 0 0;
|
||
text-align: left;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.search .btn-search::after {
|
||
display: none;
|
||
}
|
||
|
||
.search .custom-search {
|
||
width: 80%;
|
||
|
||
}
|
||
|
||
.search .custom-search.uni-searchbar {
|
||
padding-right: 0 !important;
|
||
}
|
||
|
||
.scroll-h {
|
||
/* #ifdef APP-PLUS */
|
||
height: calc(100vh - 120px);
|
||
/* #endif */
|
||
/* #ifndef APP-PLUS */
|
||
height: calc(100vh - 110px);
|
||
/* #endif */
|
||
}
|
||
|
||
.white-bg {
|
||
padding-bottom: 10rpx;
|
||
}
|
||
</style>
|