工人热更新（js），初版详情页

2026-04-27 10:40:56 +08:00
parent 1fe6e030d4
commit 1ce1ffad5a
27 changed files with 1067 additions and 28 deletions
--- a/gear-ui3/src/views/mat/product/detail.vue
+++ b/gear-ui3/src/views/mat/product/detail.vue
@@ -49,6 +49,21 @@
          />
        </div>
      </div>
+      <div class="product-pdfs" v-if="pdfDisplayList.length > 0">
+        <h4>产品说明书</h4>
+        <div class="pdf-list">
+          <div
+            v-for="(pdf, index) in pdfDisplayList"
+            :key="index"
+            class="pdf-item"
+          >
+            <el-icon class="pdf-icon"><Document /></el-icon>
+            <span class="pdf-name" :title="pdf.name">{{ pdf.name }}</span>
+            <el-button type="primary" link size="small" @click="previewPdf(pdf)">预览</el-button>
+            <el-button type="success" link size="small" @click="downloadPdf(pdf)">下载</el-button>
+          </div>
+        </div>
+      </div>
    </el-card>

    <el-card>
@@ -104,9 +119,9 @@
        </div>
      </div>

-      <!-- 工本部分 -->
+      <!-- 工价部分 -->
      <div class="material-section">
-        <h3 class="section-title">工本</h3>
+        <h3 class="section-title">工价</h3>
        <el-table :data="laborMaterials" style="width: 100%" border>
          <el-table-column prop="materialName" label="项目名称" width="150" />
          <el-table-column prop="spec" label="规格" width="150" />
@@ -123,7 +138,22 @@
          </el-table-column>
        </el-table>
        <div class="section-summary" v-if="laborMaterials.length > 0">
-          <span>工本小计：{{ formatDecimal(laborMaterials.reduce((sum, item) => sum + item.subtotal, 0)) }} 元</span>
+          <span>工价小计：{{ formatDecimal(laborMaterials.reduce((sum, item) => sum + item.subtotal, 0)) }} 元</span>
+        </div>
+      </div>
+
+      <div class="material-section" v-if="productLaborList.length > 0">
+        <h3 class="section-title">工价（手动）</h3>
+        <el-table :data="productLaborList" style="width: 100%" border>
+          <el-table-column prop="laborName" label="工价说明" />
+          <el-table-column prop="laborPrice" label="金额" width="140" align="center">
+            <template #default="scope">
+              {{ formatDecimal(scope.row.laborPrice) }}
+            </template>
+          </el-table-column>
+        </el-table>
+        <div class="section-summary">
+          <span>工价（手动）小计：{{ formatDecimal(productLaborList.reduce((sum, item) => sum + (Number(item.laborPrice) || 0), 0)) }} 元</span>
        </div>
      </div>

@@ -145,7 +175,10 @@ import { getProduct } from "@/api/mat/product";
 import { listProductMaterialRelation } from "@/api/mat/productMaterialRelation";
 import { getMaterial } from "@/api/mat/material";
 import { listProductAddition } from "@/api/mat/productAddition";
+import { listProductLabor } from "@/api/mat/productLabor";
+import { listByIds, listOss } from "@/api/system/oss";
 import { formatDecimal } from '@/utils/gear';
+import { Document } from '@element-plus/icons-vue';

 const router = useRouter();
 const route = useRoute();
@@ -154,12 +187,15 @@ const productDetail = ref({});
 const loading = ref(true);
 const materialLoading = ref(false);
 const additionLoading = ref(false);
+const pdfFiles = ref([]);
+const pdfUrlFiles = ref([]);

 // 材料明细数据
 const productMaterialRelationList = ref([]);

 // 产品附加属性数据
 const productAdditionList = ref([]);
+const productLaborList = ref([]);

 // 计算主材、辅材和工本
 const mainMaterials = computed(() => {
@@ -189,7 +225,7 @@ const auxiliaryMaterials = computed(() => {
 });

 const laborMaterials = computed(() => {
-  // 工本（材料类型为3）
+  // 工价（材料类型为3）
  return productMaterialRelationList.value
    .filter(item => item.material && item.material.materialType === 3)
    .map(item => ({
@@ -206,7 +242,24 @@ const totalAmount = computed(() => {
  const mainTotal = mainMaterials.value.reduce((sum, item) => sum + item.subtotal, 0);
  const auxiliaryTotal = auxiliaryMaterials.value.reduce((sum, item) => sum + item.subtotal, 0);
  const laborTotal = laborMaterials.value.reduce((sum, item) => sum + item.subtotal, 0);
-  return mainTotal + auxiliaryTotal + laborTotal;
+  const manualLaborTotal = productLaborList.value.reduce((sum, item) => {
+    const price = item && item.laborPrice !== undefined && item.laborPrice !== null ? Number(item.laborPrice) : 0;
+    return sum + (Number.isFinite(price) ? price : 0);
+  }, 0);
+  return mainTotal + auxiliaryTotal + laborTotal + manualLaborTotal;
+});
+
+const isOssIdList = (val) => {
+  if (val === null || val === undefined) return false;
+  const str = String(val).trim();
+  return /^[0-9]+(,[0-9]+)*$/.test(str);
+};
+
+const pdfDisplayList = computed(() => {
+  const raw = String(productDetail.value.productPdfs || '').trim();
+  if (!raw) return [];
+  if (isOssIdList(raw)) return pdfFiles.value;
+  return pdfUrlFiles.value;
 });

 // 获取产品详情
@@ -217,10 +270,12 @@ function getProductDetail() {
    getProduct(productId).then(response => {
      productDetail.value = response.data;
      loading.value = false;
+      resolvePdfFiles();
      // 获取材料明细
      getMaterialDetail(productId);
      // 获取产品附加属性
      getProductAddition(productId);
+      getProductLabor(productId);
    }).catch(error => {
      console.error('获取产品详情失败:', error);
      loading.value = false;
@@ -262,11 +317,82 @@ function getMaterialDetail(productId) {
  });
 }

+function getProductLabor(productId) {
+  listProductLabor({ productId }).then(response => {
+    productLaborList.value = response.rows || [];
+  }).catch(() => {
+    productLaborList.value = [];
+  });
+}
+
+function resolvePdfFiles() {
+  const raw = String(productDetail.value.productPdfs || '').trim();
+  if (!raw) {
+    pdfFiles.value = [];
+    pdfUrlFiles.value = [];
+    return;
+  }
+  if (isOssIdList(raw)) {
+    pdfUrlFiles.value = [];
+    listByIds(raw).then(res => {
+      const list = res.data || [];
+      pdfFiles.value = list.map(oss => ({
+        name: oss.originalName || oss.fileName || String(oss.ossId),
+        url: oss.url,
+        ossId: oss.ossId
+      }));
+    }).catch(() => {
+      pdfFiles.value = [];
+    });
+    return;
+  }
+
+  pdfFiles.value = [];
+  const urls = raw.split(',').map(s => String(s).trim()).filter(Boolean);
+  Promise.all(urls.map((url) =>
+    listOss({ url, pageNum: 1, pageSize: 1 })
+      .then(r => (r && r.rows && r.rows[0]) ? r.rows[0] : null)
+      .catch(() => null)
+  )).then(rows => {
+    pdfUrlFiles.value = urls.map((url, index) => {
+      const row = rows[index];
+      return {
+        name: (row && (row.originalName || row.fileName)) || getFileName(url),
+        url: (row && row.url) || url,
+        ossId: row && row.ossId
+      };
+    });
+  }).catch(() => {
+    pdfUrlFiles.value = urls.map(url => ({ name: getFileName(url), url }));
+  });
+}
+
 // 返回列表
 function handleBack() {
  router.back();
 }

+// 获取文件名
+function getFileName(url) {
+  if (!url) return '';
+  return url.substring(url.lastIndexOf('/') + 1);
+}
+
+// 预览PDF
+function previewPdf(pdf) {
+  if (!pdf || !pdf.url) return;
+  window.open(pdf.url, '_blank');
+}
+
+// 下载PDF
+function downloadPdf(pdf) {
+  if (!pdf || !pdf.url) return;
+  const link = document.createElement('a');
+  link.href = pdf.url;
+  link.download = pdf.name || getFileName(pdf.url);
+  link.click();
+}
+
 onMounted(() => {
  getProductDetail();
 });
@@ -312,6 +438,36 @@ onMounted(() => {
  margin-top: 10px;
 }

+.product-pdfs {
+  margin-top: 20px;
+}
+
+.pdf-list {
+  margin-top: 10px;
+}
+
+.pdf-item {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 10px;
+  background-color: #f5f7fa;
+  border-radius: 4px;
+  margin-bottom: 8px;
+}
+
+.pdf-icon {
+  font-size: 24px;
+  color: #409eff;
+}
+
+.pdf-name {
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
 .material-section {
  margin: 20px 0;
 }
@@ -357,4 +513,4 @@ onMounted(() => {
  font-weight: bold;
  color: #f56c6c;
 }
-</style>
+</style>