gaoluyang
2026-04-21 207c564c2b8d46fd86160c4f6583c2fc9d4a4e5c
src/pages/cooperativeOffice/collaborativeApproval/detail.vue
@@ -14,22 +14,29 @@
                 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="请选择申请部门"
@@ -103,6 +110,19 @@
                 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>
    <!-- 选择器弹窗 -->
@@ -227,6 +247,7 @@
      approveUserName: "",
      approveDeptName: "",
      approveDeptId: "",
      approveTitle: "", // 审批标题(自由协同审批使用)
      approveReason: "",
      checkResult: "",
      tempFileIds: [],
@@ -239,8 +260,9 @@
    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" },
@@ -271,6 +293,32 @@
  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 => ({
@@ -281,6 +329,76 @@
  };
  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;
@@ -461,44 +579,6 @@
      });
  };
  // 处理联系人选择结果
  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;
@@ -926,4 +1006,52 @@
    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>