| | |
| | | <template> |
| | | <view class="sales-account"> |
| | | <!-- 使用通用页面头部组件 --> |
| | | <PageHeader title="采购台账" @back="goBack" /> |
| | | |
| | | <!-- 搜索和筛选区域 --> |
| | | <view class="search-section"> |
| | | <view class="search-bar"> |
| | | <view class="search-input"> |
| | | <up-input |
| | | class="search-text" |
| | | placeholder="请输入采购合同号搜索" |
| | | v-model="purchaseContractNumber" |
| | | @change="getList" |
| | | clearable |
| | | /> |
| | | </view> |
| | | <view class="filter-button" @click="getList"> |
| | | <up-icon name="search" size="24" color="#999"></up-icon> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | |
| | | <!-- 采购台账瀑布流 --> |
| | | <view class="ledger-list" v-if="ledgerList.length > 0"> |
| | | <view v-for="(item, index) in ledgerList" :key="index"> |
| | | <view class="ledger-item" @click="handleInfo('edit', item)"> |
| | | <view class="item-header"> |
| | | <view class="item-left"> |
| | | <view class="document-icon"> |
| | | <up-icon name="file-text" size="16" color="#ffffff"></up-icon> |
| | | </view> |
| | | <text class="item-id">{{ item.purchaseContractNumber }}</text> |
| | | </view> |
| | | <!-- <view class="item-tag">--> |
| | | <!-- <text class="tag-text">{{ item.recorder }}</text>--> |
| | | <!-- </view>--> |
| | | </view> |
| | | <up-divider></up-divider> |
| | | |
| | | <view class="item-details"> |
| | | <view class="detail-row"> |
| | | <text class="detail-label">销售合同号</text> |
| | | <text class="detail-value">{{ item.salesContractNo }}</text> |
| | | </view> |
| | | <view class="detail-row"> |
| | | <text class="detail-label">供应商名称</text> |
| | | <text class="detail-value">{{ item.supplierName }}</text> |
| | | </view> |
| | | <view class="detail-row"> |
| | | <text class="detail-label">项目名称</text> |
| | | <text class="detail-value">{{ item.projectName }}</text> |
| | | </view> |
| | | <view class="detail-row"> |
| | | <text class="detail-label">付款方式</text> |
| | | <text class="detail-value">{{ item.paymentMethod }}</text> |
| | | </view> |
| | | <view class="detail-row"> |
| | | <text class="detail-label">合同金额(元)</text> |
| | | <text class="detail-value highlight">{{ item.contractAmount }}</text> |
| | | </view> |
| | | <up-divider></up-divider> |
| | | <view class="detail-info"> |
| | | <view class="detail-row"> |
| | | <text class="detail-label">录入人</text> |
| | | <text class="detail-value">{{ item.recorderName }}</text> |
| | | </view> |
| | | <view class="detail-row"> |
| | | <text class="detail-label">录入日期</text> |
| | | <text class="detail-value">{{ item.entryDate }}</text> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view v-else class="no-data"> |
| | | <text>暂无采购台账数据</text> |
| | | </view> |
| | | |
| | | <!-- 浮动操作按钮 --> |
| | | <view class="fab-button" @click="handleInfo('add')"> |
| | | <up-icon name="plus" size="24" color="#ffffff"></up-icon> |
| | | </view> |
| | | </view> |
| | | <view class="sales-account"> |
| | | <!-- 使用通用页面头部组件 --> |
| | | <PageHeader title="采购台账" |
| | | @back="goBack" /> |
| | | <!-- 搜索和筛选区域 --> |
| | | <view class="search-section"> |
| | | <view class="search-bar"> |
| | | <view class="search-input"> |
| | | <up-input class="search-text" |
| | | placeholder="请输入采购合同号搜索" |
| | | v-model="purchaseContractNumber" |
| | | @change="getList" |
| | | clearable /> |
| | | </view> |
| | | <view class="filter-button" |
| | | @click="getList"> |
| | | <up-icon name="search" |
| | | size="24" |
| | | color="#999"></up-icon> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <!-- 采购台账瀑布流 --> |
| | | <view class="ledger-list" |
| | | v-if="ledgerList.length > 0"> |
| | | <view v-for="(item, index) in ledgerList" |
| | | :key="index"> |
| | | <view class="ledger-item" |
| | | @click="handleInfo('edit', item)"> |
| | | <view class="item-header"> |
| | | <view class="item-left"> |
| | | <view class="document-icon"> |
| | | <up-icon name="file-text" |
| | | size="16" |
| | | color="#ffffff"></up-icon> |
| | | </view> |
| | | <text class="item-id">{{ item.purchaseContractNumber }}</text> |
| | | </view> |
| | | <view class="item-tag"> |
| | | <u-tag :type="getApprovalStatusType(item.approvalStatus)"> |
| | | {{ approvalStatusText[item.approvalStatus] || '未知状态' }} |
| | | </u-tag> |
| | | </view> |
| | | </view> |
| | | <up-divider></up-divider> |
| | | <view class="item-details"> |
| | | <!-- <view class="detail-row"> |
| | | <text class="detail-label">销售合同号</text> |
| | | <text class="detail-value">{{ item.salesContractNo }}</text> |
| | | </view> --> |
| | | <view class="detail-row"> |
| | | <text class="detail-label">供应商名称</text> |
| | | <text class="detail-value">{{ item.supplierName }}</text> |
| | | </view> |
| | | <view class="detail-row"> |
| | | <text class="detail-label">项目名称</text> |
| | | <text class="detail-value">{{ item.projectName }}</text> |
| | | </view> |
| | | <view class="detail-row"> |
| | | <text class="detail-label">付款方式</text> |
| | | <text class="detail-value">{{ item.paymentMethod }}</text> |
| | | </view> |
| | | <view class="detail-row"> |
| | | <text class="detail-label">合同金额(元)</text> |
| | | <text class="detail-value highlight">{{ item.contractAmount }}</text> |
| | | </view> |
| | | <up-divider></up-divider> |
| | | <view class="detail-info"> |
| | | <view class="detail-row"> |
| | | <text class="detail-label">录入人</text> |
| | | <text class="detail-value">{{ item.recorderName }}</text> |
| | | </view> |
| | | <view class="detail-row"> |
| | | <text class="detail-label">录入日期</text> |
| | | <text class="detail-value">{{ item.entryDate }}</text> |
| | | </view> |
| | | </view> |
| | | <!-- 仅非“审批通过”的台账展示删除按钮 --> |
| | | <view |
| | | class="detail-row" |
| | | v-if="item.approvalStatus !== 3" |
| | | style="justify-content: flex-end; margin-top: 8px;" |
| | | > |
| | | <up-button |
| | | type="error" |
| | | size="small" |
| | | plain |
| | | @click.stop="handleDelete(item)" |
| | | > |
| | | 删除 |
| | | </up-button> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view v-else |
| | | class="no-data"> |
| | | <text>暂无采购台账数据</text> |
| | | </view> |
| | | <!-- 浮动操作按钮 --> |
| | | <view class="fab-button" |
| | | @click="handleInfo('add')"> |
| | | <up-icon name="plus" |
| | | size="24" |
| | | color="#ffffff"></up-icon> |
| | | </view> |
| | | </view> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { ref } from 'vue'; |
| | | import { onShow } from '@dcloudio/uni-app'; |
| | | import useUserStore from "@/store/modules/user"; |
| | | import PageHeader from "@/components/PageHeader.vue"; |
| | | import {purchaseListPage} from "@/api/procurementManagement/procurementLedger"; |
| | | const userStore = useUserStore() |
| | | import { ref } from "vue"; |
| | | import { onShow } from "@dcloudio/uni-app"; |
| | | import useUserStore from "@/store/modules/user"; |
| | | import PageHeader from "@/components/PageHeader.vue"; |
| | | import { purchaseListPage, delPurchase } from "@/api/procurementManagement/procurementLedger"; |
| | | const userStore = useUserStore(); |
| | | const approvalStatusText = { |
| | | 1: "待审核", |
| | | 2: "审批中", |
| | | 3: "审批通过", |
| | | 4: "审批失败", |
| | | }; |
| | | // 获取审批状态标签类型 |
| | | const getApprovalStatusType = status => { |
| | | const typeMap = { |
| | | 1: "info", // 待审核 - 灰色 |
| | | 2: "warning", // 审批中 - 橙色 |
| | | 3: "success", // 审批通过 - 绿色 |
| | | 4: "error", // 审批失败 - 红色 |
| | | }; |
| | | return typeMap[status] || ""; |
| | | }; |
| | | // 搜索关键词 |
| | | const purchaseContractNumber = ref(""); |
| | | |
| | | // 搜索关键词 |
| | | const purchaseContractNumber = ref(''); |
| | | // 采购台账数据 |
| | | const ledgerList = ref([]); |
| | | |
| | | // 采购台账数据 |
| | | const ledgerList = ref([]); |
| | | // 返回上一页 |
| | | const goBack = () => { |
| | | uni.navigateBack(); |
| | | }; |
| | | // 查询列表 |
| | | const getList = () => { |
| | | showLoadingToast("加载中..."); |
| | | const page = { |
| | | current: -1, |
| | | size: -1, |
| | | }; |
| | | purchaseListPage({ |
| | | ...page, |
| | | purchaseContractNumber: purchaseContractNumber.value, |
| | | }) |
| | | .then(res => { |
| | | ledgerList.value = res.data.records; |
| | | closeToast(); |
| | | }) |
| | | .catch(() => { |
| | | closeToast(); |
| | | }); |
| | | }; |
| | | |
| | | // 返回上一页 |
| | | const goBack = () => { |
| | | uni.navigateBack(); |
| | | }; |
| | | // 查询列表 |
| | | const getList = () => { |
| | | showLoadingToast('加载中...') |
| | | const page = { |
| | | current: -1, |
| | | size: -1 |
| | | } |
| | | purchaseListPage({...page, purchaseContractNumber: purchaseContractNumber.value}).then((res) => { |
| | | ledgerList.value = res.data.records; |
| | | closeToast() |
| | | }).catch(() => { |
| | | closeToast() |
| | | }); |
| | | }; |
| | | // 显示加载提示 |
| | | const showLoadingToast = message => { |
| | | uni.showLoading({ |
| | | title: message, |
| | | mask: true, |
| | | }); |
| | | }; |
| | | |
| | | // 显示加载提示 |
| | | const showLoadingToast = (message) => { |
| | | uni.showLoading({ |
| | | title: message, |
| | | mask: true |
| | | }); |
| | | }; |
| | | // 关闭提示 |
| | | const closeToast = () => { |
| | | uni.hideLoading(); |
| | | }; |
| | | |
| | | // 关闭提示 |
| | | const closeToast = () => { |
| | | uni.hideLoading(); |
| | | }; |
| | | // 处理台账信息操作(查看/编辑/新增) |
| | | const handleInfo = (type, row) => { |
| | | try { |
| | | // 设置操作类型 |
| | | uni.setStorageSync("operationType", type); |
| | | |
| | | // 处理台账信息操作(查看/编辑/新增) |
| | | const handleInfo = (type, row) => { |
| | | try { |
| | | // 设置操作类型 |
| | | uni.setStorageSync('operationType', type); |
| | | |
| | | // 如果是查看或编辑操作 |
| | | if (type !== 'add') { |
| | | // 验证行数据是否存在 |
| | | if (!row) { |
| | | uni.showToast({ |
| | | title: '数据不存在', |
| | | icon: 'error' |
| | | }); |
| | | return; |
| | | } |
| | | |
| | | // 检查权限:只有录入人才能编辑 |
| | | if (row.recorderName != userStore.nickName) { |
| | | // 非录入人跳转到只读详情页面 |
| | | uni.setStorageSync('editData', JSON.stringify(row)); |
| | | // 如果是查看或编辑操作 |
| | | if (type !== "add") { |
| | | // 验证行数据是否存在 |
| | | if (!row) { |
| | | uni.showToast({ |
| | | title: "数据不存在", |
| | | icon: "error", |
| | | }); |
| | | return; |
| | | } |
| | | |
| | | // 检查权限:只有录入人才能编辑 |
| | | if (row.recorderName != userStore.nickName) { |
| | | // 非录入人跳转到只读详情页面 |
| | | uni.setStorageSync("editData", JSON.stringify(row)); |
| | | uni.navigateTo({ |
| | | url: "/pages/procurementManagement/procurementLedger/view", |
| | | }); |
| | | return; |
| | | } |
| | | |
| | | // 录入人编辑:存储数据并跳转到编辑页面 |
| | | uni.setStorageSync("editData", JSON.stringify(row)); |
| | | uni.navigateTo({ |
| | | url: '/pages/procurementManagement/procurementLedger/view' |
| | | url: "/pages/procurementManagement/procurementLedger/detail", |
| | | }); |
| | | return; |
| | | } |
| | | |
| | | // 录入人编辑:存储数据并跳转到编辑页面 |
| | | uni.setStorageSync('editData', JSON.stringify(row)); |
| | | |
| | | // 新增操作:直接跳转到编辑页面 |
| | | uni.navigateTo({ |
| | | url: '/pages/procurementManagement/procurementLedger/detail' |
| | | url: "/pages/procurementManagement/procurementLedger/detail", |
| | | }); |
| | | } catch (error) { |
| | | console.error("处理台账信息操作失败:", error); |
| | | uni.showToast({ |
| | | title: "操作失败,请重试", |
| | | icon: "error", |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 删除单条采购台账 |
| | | const handleDelete = row => { |
| | | if (!row || !row.id) { |
| | | uni.showToast({ |
| | | title: "数据有误,无法删除", |
| | | icon: "none", |
| | | }); |
| | | return; |
| | | } |
| | | |
| | | // 新增操作:直接跳转到编辑页面 |
| | | uni.navigateTo({ |
| | | url: '/pages/procurementManagement/procurementLedger/detail' |
| | | }); |
| | | |
| | | } catch (error) { |
| | | console.error('处理台账信息操作失败:', error); |
| | | uni.showToast({ |
| | | title: '操作失败,请重试', |
| | | icon: 'error' |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | onShow(() => { |
| | | uni.showModal({ |
| | | title: "提示", |
| | | content: "选中的内容将被删除,是否确认删除?", |
| | | confirmText: "确认", |
| | | cancelText: "取消", |
| | | success: res => { |
| | | if (res.confirm) { |
| | | delPurchase([row.id]) |
| | | .then(result => { |
| | | // 成功:code === 200 |
| | | if (result && result.code === 200) { |
| | | uni.showToast({ |
| | | title: "删除成功", |
| | | icon: "success", |
| | | }); |
| | | getList(); |
| | | return; |
| | | } |
| | | // 业务失败:优先展示后端返回的 msg(如 CG2026... 不允许删除) |
| | | uni.showToast({ |
| | | title: (result && result.msg) || "删除失败", |
| | | icon: "none", |
| | | }); |
| | | }) |
| | | .catch(error => { |
| | | // 对于 request 封装返回的 '500' 或其他 code,错误提示已经在 request 里 toast 过了,这里不再重复覆盖 |
| | | if (error === "500" || typeof error === "number") { |
| | | return; |
| | | } |
| | | // 只有在真正异常时,才在这里兜底提示 |
| | | const msg = |
| | | (error && error.msg) || |
| | | (error && error.response && error.response.data && error.response.data.msg) || |
| | | (error && error.message) || |
| | | "删除失败"; |
| | | uni.showToast({ |
| | | title: msg, |
| | | icon: "none", |
| | | }); |
| | | }); |
| | | } |
| | | }, |
| | | }); |
| | | }; |
| | | |
| | | onShow(() => { |
| | | // 页面显示时刷新列表 |
| | | getList(); |
| | | }); |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped lang="scss"> |
| | | @import '@/styles/procurement-common.scss'; |
| | | @import "@/styles/procurement-common.scss"; |
| | | |
| | | // 采购台账特有样式(如有需要可在此添加) |
| | | // 采购台账特有样式(如有需要可在此添加) |
| | | </style> |