| | |
| | | disabled |
| | | placeholder="自动编号" /> |
| | | </u-form-item> |
| | | <!-- 审批标题(仅当 approveType 为 9 或 10 时显示) --> |
| | | <u-form-item v-if="approveType === 9 || approveType === 10" |
| | | prop="approveTitle" |
| | | label="审批标题" |
| | | required> |
| | | <u-input v-model="form.approveTitle" |
| | | placeholder="请输入审批标题" |
| | | clearable /> |
| | | </u-form-item> |
| | | <u-form-item prop="approveReason" |
| | | :label="approveType === 5 ? '采购事由' : '申请事由'" |
| | | :label="getApproveReasonLabel()" |
| | | required> |
| | | <u-input v-model="form.approveReason" |
| | | type="textarea" |
| | | rows="2" |
| | | auto-height |
| | | maxlength="200" |
| | | :placeholder="approveType === 5 ? '请输入采购事由' : '请输入申请事由'" |
| | | :placeholder="getApproveReasonPlaceholder()" |
| | | show-word-limit /> |
| | | </u-form-item> |
| | | <u-form-item prop="approveDeptName" |
| | | label="申请部门" |
| | | required> |
| | | <!-- <u-input v-model="form.approveDeptName" |
| | | placeholder="请选择申请部门" /> --> |
| | | <u-input v-model="form.approveDeptName" |
| | | readonly |
| | | placeholder="请选择申请部门" |
| | |
| | | type="number" |
| | | placeholder="请输入报销金额" |
| | | clearable /> |
| | | </u-form-item> |
| | | <!-- 附件上传 --> |
| | | <u-form-item label="附件材料"> |
| | | <view class="file-upload-area"> |
| | | <view v-for="(file, index) in fileList" :key="file.id || index" class="file-item"> |
| | | <text class="file-name">{{ file.name || file.fileName }}</text> |
| | | <text class="file-delete" @click="removeFile(index)">×</text> |
| | | </view> |
| | | <view class="upload-btn" @click="chooseFile" v-if="operationType !== 'view'"> |
| | | <up-icon name="plus" size="20" color="#006cfb"></up-icon> |
| | | <text class="upload-text">上传附件</text> |
| | | </view> |
| | | </view> |
| | | </u-form-item> |
| | | </u-form> |
| | | <!-- 选择器弹窗 --> |
| | |
| | | approveUserName: "", |
| | | approveDeptName: "", |
| | | approveDeptId: "", |
| | | approveTitle: "", // 审批标题(自由协同审批使用) |
| | | approveReason: "", |
| | | checkResult: "", |
| | | tempFileIds: [], |
| | |
| | | rules: { |
| | | approveTime: [{ required: false, message: "请输入", trigger: "change" }], |
| | | approveId: [{ required: false, message: "请输入", trigger: "blur" }], |
| | | approveDeptId: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | approveDeptId: [{ required: true, message: "请选择", trigger: "change" }], |
| | | approveReason: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | approveTitle: [{ required: true, message: "请输入审批标题", trigger: "blur" }], |
| | | checkResult: [{ required: false, message: "请输入", trigger: "blur" }], |
| | | startDate: [ |
| | | { required: false, message: "请选择开始时间", trigger: "change" }, |
| | |
| | | const userStore = useUserStore(); |
| | | const approveType = ref(0); |
| | | |
| | | // 获取审批事由标签 |
| | | const getApproveReasonLabel = () => { |
| | | const type = Number(approveType.value); |
| | | if (type === 5) { |
| | | return '采购计划说明'; |
| | | } else if (type === 9) { |
| | | return '销售合同号'; |
| | | } else if (type === 10) { |
| | | return '审批事由'; |
| | | } |
| | | return '审批事由'; |
| | | }; |
| | | |
| | | // 获取审批事由占位符 |
| | | const getApproveReasonPlaceholder = () => { |
| | | const type = Number(approveType.value); |
| | | if (type === 5) { |
| | | return '请输入采购计划说明'; |
| | | } else if (type === 9) { |
| | | return '请输入销售合同号'; |
| | | } else if (type === 10) { |
| | | return '请输入审批事由'; |
| | | } |
| | | return '请输入申请事由'; |
| | | }; |
| | | |
| | | const getProductOptions = () => { |
| | | getDept().then(res => { |
| | | productOptions.value = res.data.map(item => ({ |
| | |
| | | }; |
| | | const fileList = ref([]); |
| | | let nextApproverId = 2; |
| | | |
| | | // 处理部门选择变化 |
| | | const handleDeptChange = (deptIds) => { |
| | | if (deptIds && deptIds.length > 0) { |
| | | const selectedNames = productOptions.value |
| | | .filter(dept => deptIds.includes(dept.value)) |
| | | .map(dept => dept.name); |
| | | form.value.approveDeptName = selectedNames.join(','); |
| | | } else { |
| | | form.value.approveDeptName = ''; |
| | | } |
| | | }; |
| | | |
| | | // 选择审批人 |
| | | const addApprover = (stepIndex) => { |
| | | uni.setStorageSync("stepIndex", stepIndex); |
| | | uni.navigateTo({ |
| | | url: "/pages/cooperativeOffice/collaborativeApproval/contactSelect", |
| | | }); |
| | | }; |
| | | |
| | | // 添加审批节点 |
| | | const addApprovalStep = () => { |
| | | approverNodes.value.push({ id: nextApproverId++, userId: null, nickName: null }); |
| | | }; |
| | | |
| | | // 移除审批人 |
| | | const removeApprover = (stepIndex) => { |
| | | approverNodes.value[stepIndex].userId = null; |
| | | approverNodes.value[stepIndex].nickName = null; |
| | | }; |
| | | |
| | | // 移除审批节点 |
| | | const removeApprovalStep = (stepIndex) => { |
| | | if (approverNodes.value.length > 1) { |
| | | approverNodes.value.splice(stepIndex, 1); |
| | | } else { |
| | | showToast("至少需要一个审批步骤"); |
| | | } |
| | | }; |
| | | |
| | | // 处理联系人选择结果 |
| | | const handleSelectContact = (data) => { |
| | | const { stepIndex, contact } = data; |
| | | approverNodes.value[stepIndex].userId = contact.userId; |
| | | approverNodes.value[stepIndex].nickName = contact.nickName; |
| | | }; |
| | | |
| | | // 选择文件上传 |
| | | const chooseFile = () => { |
| | | uni.chooseMessageFile({ |
| | | count: 10, |
| | | success: (res) => { |
| | | const tempFilePaths = res.tempFiles; |
| | | // 这里可以添加上传逻辑 |
| | | tempFilePaths.forEach(file => { |
| | | fileList.value.push({ |
| | | name: file.name, |
| | | path: file.path, |
| | | size: file.size, |
| | | }); |
| | | }); |
| | | } |
| | | }); |
| | | }; |
| | | |
| | | // 移除文件 |
| | | const removeFile = (index) => { |
| | | fileList.value.splice(index, 1); |
| | | }; |
| | | const getCurrentinfo = () => { |
| | | userStore.getInfo().then(res => { |
| | | form.value.approveDeptId = res.user.tenantId; |
| | |
| | | }); |
| | | }; |
| | | |
| | | // 处理联系人选择结果 |
| | | const handleSelectContact = data => { |
| | | const { stepIndex, contact } = data; |
| | | // 将选中的联系人设置为对应审批步骤的审批人 |
| | | approverNodes.value[stepIndex].userId = contact.userId; |
| | | approverNodes.value[stepIndex].nickName = contact.nickName; |
| | | }; |
| | | |
| | | const addApprover = stepIndex => { |
| | | // 跳转到联系人选择页面 |
| | | uni.setStorageSync("stepIndex", stepIndex); |
| | | uni.navigateTo({ |
| | | url: "/pages/cooperativeOffice/collaborativeApproval/contactSelect", |
| | | }); |
| | | }; |
| | | |
| | | const addApprovalStep = () => { |
| | | // 添加新的审批步骤 |
| | | approverNodes.value.push({ userId: null, nickName: null }); |
| | | }; |
| | | |
| | | const removeApprover = stepIndex => { |
| | | // 移除审批人 |
| | | approverNodes.value[stepIndex].userId = null; |
| | | approverNodes.value[stepIndex].nickName = null; |
| | | }; |
| | | |
| | | const removeApprovalStep = stepIndex => { |
| | | // 确保至少保留一个审批步骤 |
| | | if (approverNodes.value.length > 1) { |
| | | approverNodes.value.splice(stepIndex, 1); |
| | | } else { |
| | | uni.showToast({ |
| | | title: "至少需要一个审批步骤", |
| | | icon: "none", |
| | | }); |
| | | } |
| | | }; |
| | | // 显示日期选择器 |
| | | const showDatePicker = () => { |
| | | showDate.value = true; |
| | |
| | | color: #3b82f6; |
| | | font-size: 14px; |
| | | } |
| | | |
| | | // 文件上传区域样式 |
| | | .file-upload-area { |
| | | display: flex; |
| | | flex-direction: column; |
| | | gap: 8px; |
| | | } |
| | | |
| | | .file-item { |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-between; |
| | | background: #f8f9fa; |
| | | padding: 10px 12px; |
| | | border-radius: 8px; |
| | | } |
| | | |
| | | .file-name { |
| | | font-size: 14px; |
| | | color: #333; |
| | | flex: 1; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | white-space: nowrap; |
| | | } |
| | | |
| | | .file-delete { |
| | | font-size: 18px; |
| | | color: #ff4d4f; |
| | | margin-left: 8px; |
| | | padding: 0 4px; |
| | | } |
| | | |
| | | .upload-btn { |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | gap: 8px; |
| | | border: 2px dashed #d9d9d9; |
| | | border-radius: 8px; |
| | | padding: 16px; |
| | | background: #fafafa; |
| | | } |
| | | |
| | | .upload-text { |
| | | font-size: 14px; |
| | | color: #666; |
| | | } |
| | | </style> |