| | |
| | | style="width: 220px" |
| | | /> |
| | | </div> |
| | | </div> |
| | | <div class="base-info-row"> |
| | | <div class="info-item"> |
| | | <span class="item-label">附件</span> |
| | | <el-upload |
| | | v-if="isEdit" |
| | | :action="uploadUrl" |
| | | :headers="uploadHeaders" |
| | | :on-success="handleUploadSuccess" |
| | | :on-remove="handleRemove" |
| | | v-model:file-list="uploadFileList" |
| | | :limit="3" |
| | | name="files" |
| | | multiple |
| | | > |
| | | <el-button type="primary">上传附件</el-button> |
| | | </el-upload> |
| | | <FileUpload v-if="isEdit" v-model:file-list="uploadFileList" /> |
| | | <span v-else class="text-gray-400 text-sm">请先保存后再上传附件</span> |
| | | </div> |
| | | </div> |
| | | |
| | | |
| | | <!-- 步骤配置表格 --> |
| | | <p class="top-tip">请按照顺序配置项目阶段,拖拽<b>步骤</b>排序即可</p> |
| | |
| | | |
| | | <template #footer> |
| | | <div class="dialog-footer"> |
| | | <el-button @click="visible = false">取消</el-button> |
| | | <el-button type="primary" @click="submitForm">提交</el-button> |
| | | <el-button @click="visible = false">取消</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | |
| | | import { ElMessage, ElMessageBox } from 'element-plus'; |
| | | import { getToken } from '@/utils/auth'; |
| | | import Sortable from 'sortablejs'; |
| | | import FileUpload from "@/components/AttachmentUpload/file/index.vue"; |
| | | |
| | | const props = defineProps({ |
| | | modelValue: Boolean, |
| | |
| | | const formRef = ref(null); |
| | | const userOptions = ref([]); |
| | | const isEdit = ref(false); |
| | | const uploadHeaders = { Authorization: "Bearer " + getToken() }; |
| | | // 上传地址 |
| | | const uploadUrl = import.meta.env.VITE_APP_BASE_API + "/basic/customer-follow/upload"; |
| | | let sortable = null; |
| | | |
| | | const form = ref({ |
| | | id: undefined, |
| | | name: '', |
| | | description: '', |
| | | attachmentIds: [], |
| | | savePlanNodeList: [] |
| | | }); |
| | | const uploadFileList = ref([]); |
| | |
| | | id: props.data.id, |
| | | name: props.data.name, |
| | | description: props.data.description, |
| | | attachmentIds: Array.isArray(props.data.attachmentIds) |
| | | ? props.data.attachmentIds |
| | | : (props.data.attachmentList || []).map(f => f.id).filter(Boolean), |
| | | savePlanNodeList: [] |
| | | }; |
| | | uploadFileList.value = props.data.storageBlobDTOs || []; |
| | | |
| | | // 回显步骤节点 |
| | | if (props.data.planNodeList && props.data.planNodeList.length > 0) { |
| | |
| | | id: undefined, |
| | | name: '', |
| | | description: '', |
| | | attachmentIds: [], |
| | | savePlanNodeList: [createDefaultNode()] |
| | | }; |
| | | uploadFileList.value = []; |
| | |
| | | if (user) { |
| | | row.leaderName = user.nickName; |
| | | } |
| | | } |
| | | |
| | | /** 处理文件上传成功 */ |
| | | function handleUploadSuccess(response, file, fileList) { |
| | | if (response.code === 200) { |
| | | const newFile = response.data; |
| | | const list = Array.isArray(newFile) ? newFile : [newFile]; |
| | | list.forEach(element => { |
| | | const id = element?.id; |
| | | if (id && !form.value.attachmentIds.includes(id)) { |
| | | form.value.attachmentIds.push(id); |
| | | } |
| | | }); |
| | | } else { |
| | | ElMessage.error(response.msg || '上传失败'); |
| | | } |
| | | } |
| | | |
| | | /** 处理文件移除 */ |
| | | function handleRemove(file) { |
| | | const removedId = file?.id || file?.response?.data?.id; |
| | | if (!removedId) return; |
| | | form.value.attachmentIds = form.value.attachmentIds.filter(id => id !== removedId); |
| | | } |
| | | |
| | | /** 添加步骤 */ |
| | |
| | | form.value.savePlanNodeList.forEach((node, index) => { |
| | | node.sort = index; |
| | | }); |
| | | form.value.storageBlobDTOs = uploadFileList.value; |
| | | emit('submit', form.value); |
| | | } |
| | | } catch (error) { |
| | |
| | | } |
| | | |
| | | .dialog-footer { |
| | | display: flex; |
| | | justify-content: flex-end; |
| | | gap: 15px; |
| | | padding-top: 10px; |
| | | text-align: center; |
| | | } |
| | | .top-tip { |
| | | |