生产订单页面开发联调

gaoluyang

2025-09-26 846bb33d3243871c3dc4226e3c054bedc8a71660

生产订单页面开发联调

 src/pages.json

@@ -399,6 +399,13 @@
        "navigationBarTitleText": "故障分析追溯",
        "navigationStyle": "custom"
      }
    },
    {
      "path": "pages/productionManagement/productionOrder/index",
      "style": {
        "navigationBarTitleText": "生产订单",
        "navigationStyle": "custom"
      }
    }
  ],
  "subPackages": [

 src/pages/productionManagement/productionOrder/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,193 @@
<template>
    <view class="production-order">
        <!-- ä½¿ç”¨é€šç”¨é¡µé¢å¤´éƒ¨ç»„件 -->
        <PageHeader title="生产订单" @back="goBack" />
		
        <!-- æœç´¢åŒºåŸŸ -->
        <view class="search-section">
            <view class="search-bar">
                <view class="search-input">
                    <up-input
                        class="search-text"
                        placeholder="请输入客户名称搜索"
                        v-model="searchForm.customerName"
                        @change="handleQuery"
                        clearable
                    />
                </view>
                <view class="filter-button" @click="handleQuery">
                    <up-icon name="search" size="24" color="#999"></up-icon>
                </view>
            </view>
        </view>
		
        <!-- ç”Ÿäº§è®¢å•åˆ—表 -->
        <view class="ledger-list" v-if="tableData.length > 0">
            <view v-for="(item, index) in tableData" :key="item.id || index">
                <view class="ledger-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.salesContractNo }}</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.entryDate }}</text>
                        </view>
                        <view class="detail-row">
                            <text class="detail-label">客户合同号</text>
                            <text class="detail-value">{{ item.customerContractNo }}</text>
                        </view>
                        <view class="detail-row">
                            <text class="detail-label">客户名称</text>
                            <text class="detail-value">{{ item.customerName }}</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.productCategory }}</text>
                        </view>
                        <view class="detail-row">
                            <text class="detail-label">规格型号</text>
                            <text class="detail-value">{{ item.specificationModel }}</text>
                        </view>
                        <view class="detail-row">
                            <text class="detail-label">数量</text>
                            <text class="detail-value">{{ item.quantity }} {{ item.unit }}</text>
                        </view>
                        <view class="detail-row">
                            <text class="detail-label">排产数量</text>
                            <text class="detail-value highlight">{{ item.schedulingNum }}</text>
                        </view>
                        <view class="detail-row">
                            <text class="detail-label">完工数量</text>
                            <text class="detail-value highlight">{{ item.successNum }}</text>
                        </view>
                    </view>
                </view>
            </view>
        </view>
        <view v-else class="no-data">
            <text>暂无生产订单数据</text>
        </view>
    </view>
</template>

<script setup>
import { ref, reactive, toRefs, getCurrentInstance } from "vue";
import { onShow } from '@dcloudio/uni-app';
import dayjs from "dayjs";
import {schedulingListPage} from "@/api/productionManagement/productionOrder.js";
import PageHeader from "@/components/PageHeader.vue";
const { proxy } = getCurrentInstance();

// åŠ è½½çŠ¶æ€
const loading = ref(false);
// åˆ—表数据
const tableData = ref([]);

// åˆ†é¡µé…ç½®
const page = reactive({
    current: -1,
    size: -1,
    total: 0,
});

// æœç´¢è¡¨å•æ•°æ®
const data = reactive({
    searchForm: {
        customerName: "",
    },
});
const { searchForm } = toRefs(data);

// é€šç”¨æç¤ºå‡½æ•°
const showLoadingToast = (message) => {
    uni.showLoading({
        title: message,
        mask: true
    });
};

const closeToast = () => {
    uni.hideLoading();
};

// è¿”回上一页
const goBack = () => {
    uni.navigateBack();
};

// æŸ¥è¯¢åˆ—表
const handleQuery = () => {
    page.current = 1;
    tableData.value = []; // é‡ç½®åˆ—表数据
    getList();
};

// èŽ·å–列表数据
const getList = () => {
    loading.value = true;
    showLoadingToast('加载中...');
	
    // æž„造请求参数
    const params = { ...searchForm.value, ...page };
	
    schedulingListPage(params).then((res) => {
        loading.value = false;
        closeToast();
		
        tableData.value = res.data.records || [];
    }).catch(() => {
        loading.value = false;
        closeToast();
        uni.showToast({
            title: '加载失败',
            icon: 'error'
        });
    });
};

// é¡µé¢æ˜¾ç¤ºæ—¶åŠ è½½æ•°æ®
onShow(() => {
    // åŠ è½½åˆ—表数据
    getList();
});
</script>

<style scoped lang="scss">
@import '@/styles/sales-common.scss';

// ç”Ÿäº§è®¢å•é¡µé¢æ ·å¼
.production-order {
    min-height: 100vh;
    background: #f8f9fa;
    position: relative;
}

// é‡å†™éƒ¨åˆ†æ ·å¼ä»¥é€‚配生产订单
.ledger-item {
    .detail-value.highlight {
        color: #ff6b35;
        font-weight: 600;
    }
}

// é€‚配 uView ç»„件样式
:deep(.up-input) {
    background: transparent;
}

:deep(.up-datetime-picker) {
    width: 100%;
}
</style>