添加内勤专用查看

2025-10-23 10:05:13 +08:00
parent 3aa1b0f79b
commit 2ba64b94b0
5 changed files with 390 additions and 35 deletions
@@ -0,0 +1,212 @@
+<template>
+  <el-dialog
+    :model-value="visible"
+    @update:model-value="emit('update:visible', $event)"
+    title="内勤专用"
+    width="90%"
+    :close-on-click-modal="false"
+  >
+    <div style="margin-bottom: 12px; display: flex; align-items: center; gap: 12px">
+      <span>显示币种：</span>
+      <el-select v-model="selectedCurrency" placeholder="选择币种" style="width: 200px">
+        <el-option
+          v-for="opt in currencyOptions"
+          :key="opt.currency_code"
+          :label="opt.currency_name + ' (' + opt.currency_code + ')'"
+          :value="opt.currency_code"
+        />
+      </el-select>
+    </div>
+    <div>
+      <el-table :data="displayData" style="width: 100%">
+        <el-table-column label="编号" width="80" align="center">
+          <template #default="scope">
+            {{ scope.$index + 1 }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="model" label="车型" min-width="160" />
+        <el-table-column prop="qty" label="数量" width="80" />
+        <el-table-column prop="clearance_price" label="报关价" min-width="140">
+          <template #default="scope">{{ scope.row.clearance_price }}</template>
+        </el-table-column>
+        <el-table-column prop="fob_transport_fee" label="FOB运费" min-width="140">
+          <template #default="scope">{{ scope.row.fob_transport_fee }}</template>
+        </el-table-column>
+        <el-table-column prop="car_price" label="车价" min-width="140">
+          <template #default="scope">{{ scope.row.car_price }}</template>
+        </el-table-column>
+        <el-table-column prop="ocean_freight" label="海运费" min-width="140">
+          <template #default="scope">{{ scope.row.ocean_freight }}</template>
+        </el-table-column>
+        <el-table-column prop="commission" label="佣金" min-width="140">
+          <template #default="scope">{{ scope.row.commission }}</template>
+        </el-table-column>
+        <el-table-column prop="retention_price" label="挂账" min-width="140">
+          <template #default="scope">{{ scope.row.retention_price }}</template>
+        </el-table-column>
+        <el-table-column prop="port_misc_fee" label="港杂" min-width="140">
+          <template #default="scope">{{ scope.row.port_misc_fee }}</template>
+        </el-table-column>
+      </el-table>
+    </div>
+  </el-dialog>
+</template>
+
+<script setup lang="ts">
+  import { ref, computed, watch } from 'vue'
+  import { commonService } from '@/api/commonApi'
+
+  defineOptions({
+    name: 'InternalStaffView'
+  })
+
+  interface CurrencyOption {
+    currency_code: string
+    currency_name: string
+    rate?: number
+    exchange_rate?: number
+  }
+
+  interface VehicleData {
+    model_snapshot?: string
+    model?: string
+    qty?: number
+    clearance_price?: any
+    clearance_price_currency?: string
+    fob_transport_fee?: any
+    fob_fee_currency?: string
+    car_price?: any
+    car_price_currency?: string
+    ocean_freight?: any
+    ocean_freight_currency?: string
+    commission?: any
+    commission_currency?: string
+    retention_price?: any
+    retention_price_currency?: string
+    port_misc_fee?: any
+    port_fee_currency?: string
+  }
+
+  const props = defineProps<{
+    visible: boolean
+    vehicleData: VehicleData[]
+    defaultCurrency?: string
+  }>()
+
+  const emit = defineEmits<{
+    'update:visible': [value: boolean]
+  }>()
+
+  const selectedCurrency = ref('')
+  const currencyOptions = ref<CurrencyOption[]>([])
+
+  const loadCurrencyOptions = async () => {
+    try {
+      const res = await commonService.getCurrencySelect()
+      currencyOptions.value = res || []
+    } catch (e) {
+      console.error('获取币种失败', e)
+    }
+  }
+
+  const rateOf = (c?: string) => {
+    const found = (currencyOptions.value || []).find((x: any) => x.currency_code === c)
+    return Number(found?.rate || found?.exchange_rate || 0) || 0
+  }
+
+  const convert = (amount: any, fromCode?: string, toCode?: string): number => {
+    const val = amount === undefined || amount === null || amount === '' ? 0 : Number(amount)
+    if (Number.isNaN(val)) return 0
+    const from = fromCode || 'USD'
+    const to = toCode || 'USD'
+    if (from === to) return val
+    const rf = rateOf(from)
+    const rt = rateOf(to) || 1
+    if (!rf) return 0
+    return (val * rf) / rt
+  }
+
+  const fmt = (n: number, cur: string) => `${n.toFixed(2)} ${cur}`
+
+  const displayData = computed(() => {
+    const code = selectedCurrency.value
+    return (props.vehicleData || []).map((it: VehicleData) => {
+      return {
+        model: it.model_snapshot || it.model || '',
+        qty: it.qty || 1,
+        clearance_price: fmt(
+          convert(
+            it.clearance_price?.amount ?? it.clearance_price,
+            it.clearance_price?.currency || it.clearance_price_currency,
+            code
+          ),
+          code
+        ),
+        fob_transport_fee: fmt(
+          convert(
+            it.fob_transport_fee?.amount ?? it.fob_transport_fee,
+            it.fob_transport_fee?.currency || it.fob_fee_currency || it.ocean_freight_currency,
+            code
+          ),
+          code
+        ),
+        car_price: fmt(
+          convert(
+            it.car_price?.amount ?? it.car_price,
+            it.car_price?.currency || it.car_price_currency,
+            code
+          ),
+          code
+        ),
+        ocean_freight: fmt(
+          convert(
+            it.ocean_freight?.amount ?? it.ocean_freight,
+            it.ocean_freight?.currency || it.ocean_freight_currency,
+            code
+          ),
+          code
+        ),
+        commission: fmt(
+          convert(
+            it.commission?.amount ?? it.commission,
+            it.commission?.currency || it.commission_currency,
+            code
+          ),
+          code
+        ),
+        retention_price: fmt(
+          convert(
+            it.retention_price?.amount ?? it.retention_price,
+            it.retention_price?.currency || it.retention_price_currency,
+            code
+          ),
+          code
+        ),
+        port_misc_fee: fmt(
+          convert(
+            it.port_misc_fee?.amount ?? it.port_misc_fee,
+            it.port_misc_fee?.currency || it.port_fee_currency,
+            code
+          ),
+          code
+        )
+      }
+    })
+  })
+
+  // 监听 visible 变化，加载币种选项
+  watch(
+    () => props.visible,
+    (newVisible) => {
+      if (newVisible) {
+        loadCurrencyOptions()
+        // 设置默认币种
+        if (props.defaultCurrency) {
+          selectedCurrency.value = props.defaultCurrency
+        } else {
+          selectedCurrency.value = 'USD'
+        }
+      }
+    }
+  )
+</script>
@@ -41,11 +41,17 @@
          <ElTableColumn label="状态" prop="approval_status">
            <template #default="scope">
              <div v-if="scope.row.appro_status">
-                <div
-                  ><span :class="statusClass(scope.row.appro_status.status)">{{ scope.row.appro_status.status_desc ? scope.row.appro_status.status_desc : '' }}</span>
-                  <span v-if="scope.row.appro_status.name != ''"
-                    >【{{ scope.row.appro_status.name }}】</span
-                  >
+                <div>
+                  <span :class="statusClass(scope.row.appro_status.status)">
+                    {{
+                      scope.row.appro_status.status_desc
+                        ? scope.row.appro_status.status_desc
+                        : ''
+                    }}
+                  </span>
+                  <span v-if="scope.row.appro_status.name != ''">
+                    【{{ scope.row.appro_status.name }}】
+                  </span>
                </div>
              </div>
              <div v-else></div>
@@ -63,12 +69,30 @@
                >
                  <i class="iconfont-sys">&#xe782;</i> 打印预览
                </el-link>
-                <el-link type="primary" underline="never" @click="handleView1(scope.row)">
+                <el-link
+                  type="primary"
+                  underline="never"
+                  @click="handleView1(scope.row)"
+                  style="margin-right: 8px"
+                >
                  <i class="iconfont-sys">&#xe76c;</i> 查看终版
                </el-link>
-                <el-link type="warning" underline="never" @click="showDialogtimeline(scope.row)">
+                <el-link
+                  type="warning"
+                  underline="never"
+                  @click="showDialogtimeline(scope.row)"
+                  style="margin-right: 8px"
+                >
                  <i class="iconfont-sys">&#xe728;</i> 查看审批
                </el-link>
+                <el-link
+                  type="primary"
+                  underline="never"
+                  @click="handleViewnq(scope.row)"
+                  style="margin-right: 8px;color: #750AF8"
+                >
+                  <i class="iconfont-sys">&#xe76c;</i> 内勤专用
+                </el-link>
              </ElRow>
            </template>
          </ElTableColumn>
@@ -147,24 +171,39 @@
        <ApprovalTimeline :records="approvalRecords" />
      </div>
    </el-dialog>
+    <!-- 内勤查看弹窗 -->
+    <InternalStaffView
+      v-model:visible="nqDialogVisible"
+      :vehicle-data="nqData"
+      :default-currency="nqCurrency"
+    />
  </div>
 </template>

 <script setup lang="ts">
-  import { router } from '@/router'
+  // import { router } from '@/router'
  // import { CrmService } from '@/api/crmApi'
  import { manageService } from '@/api/adminApi'
-  import { useAuth } from '@/composables/useAuth'
+  // import { useAuth } from '@/composables/useAuth'
  import OrderDetailContent from '@/components/custom/OrderDetailContent.vue'
  import ApprovalTimeline from '@/components/custom/ApprovalTimeline.vue'
  import type { OrderData } from '@/composables/useOrderDetailDialog'
  import { usePdfPreview } from '@/composables/usePdfPreview'
  import FilePreview from '@/components/custom/FilePreview.vue'
+  import InternalStaffView from '@/components/custom/InternalStaffView.vue'
  const timelineDialogVisible = ref(false)
  const approvalRecords = ref<any[]>([])
  const isFinites = ref(false)
  // PDF 预览/打印（公共）
-  const { pdf, frameRef, openWithResponse, download, print, preparePreview, prepareImages } = usePdfPreview()
+  const {
+    pdf,
+    frameRef,
+    openWithResponse,
+    download,
+    /* print,*/
+    preparePreview,
+    prepareImages
+  } = usePdfPreview()
  defineOptions({ name: 'AdminFinalListPage' })
  // 订单详情弹窗
  const orderDialog = reactive({
@@ -173,13 +212,18 @@
    orderData: {} as OrderData
  })

-  const { hasAuth } = useAuth()
+  // const { hasAuth } = useAuth()
  const loading = ref(false)
  const keyword = ref('')
  const tableRef = ref()
  const tableData = ref<any[]>([])
  const pagination = reactive({ currentPage: 1, pageSize: 10, total: 0 })

+  // 内勤查看：币种与数据
+  const nqDialogVisible = ref(false)
+  const nqCurrency = ref('')
+  const nqData = ref<any[]>([])
+
  onMounted(() => {
    getList()
  })
@@ -243,6 +287,36 @@
        console.log(err)
      })
  }
+  const handleViewnq = async (row: any) => {
+    const res = await manageService.checkStock({ id: row.id })
+    // 默认币种来自 currency_symbol
+    if (res?.currency_symbol) {
+      nqCurrency.value = res.currency_symbol
+    } else {
+      nqCurrency.value = 'USD'
+    }
+    const list = Array.isArray(res?.veh_list) ? res.veh_list : []
+    nqData.value = list.map((it: any) => ({
+      model_snapshot: it.model_snapshot,
+      qty: 1,
+      clearance_price: it.clearance_price,
+      clearance_price_currency: it.clearance_price?.currency || it.clearance_price_currency,
+      fob_transport_fee: it.fob_transport_fee,
+      fob_fee_currency: it.fob_transport_fee?.currency || it.fob_fee_currency,
+      car_price: it.car_price,
+      car_price_currency: it.car_price?.currency || it.car_price_currency,
+      ocean_freight: it.ocean_freight,
+      ocean_freight_currency: it.ocean_freight?.currency || it.ocean_freight_currency,
+      commission: it.commission,
+      commission_currency: it.commission?.currency || it.commission_currency,
+      retention_price: it.retention_price,
+      retention_price_currency: it.retention_price?.currency || it.retention_price_currency,
+      port_misc_fee: it.port_misc_fee,
+      port_fee_currency: it.port_misc_fee?.currency || it.port_fee_currency,
+      model: it.model_snapshot
+    }))
+    nqDialogVisible.value = true
+  }
  // 文件数据
  const contractFiles = ref<Array<{ name: string; url: string; file_name: string }>>([])
  const piFiles = ref<Array<{ name: string; url: string; file_name: string }>>([])
@@ -294,7 +368,7 @@
    // TODO: 跳转或弹窗查看备货单
  }
  // 判断是否为图片文件
-  const isImageFile = (file: { name: string; url: string; file_name: string }) => {
+  /* const isImageFile = (file: { name: string; url: string; file_name: string }) => {
    // 检查文件名
    if (file.name && /\.(jpg|jpeg|png|gif|webp)$/i.test(file.name)) {
      return true
@@ -314,10 +388,10 @@
    }
    
    return false
-  }
+  } */

  // 预览图片
-  const previewImage = (file: { name: string; url: string; file_name: string }) => {
+  /* const previewImage = (file: { name: string; url: string; file_name: string }) => {
    // 创建图片预览弹窗
    const imagePreview = document.createElement('div')
    imagePreview.style.cssText = `
@@ -380,10 +454,10 @@
      }
    }
    document.addEventListener('keydown', handleKeydown)
-  }
+  } */

  // 下载文件
-  const downloadFile = (file: { name: string; url: string; file_name: string }) => {
+  /* const downloadFile = (file: { name: string; url: string; file_name: string }) => {
    try {
      const link = document.createElement('a')
      link.href = file.url
@@ -396,7 +470,7 @@
      console.error('下载失败:', error)
      ElMessage.error('下载失败，请稍后重试')
    }
-  }
+  } */
  //审批进度
  const showDialogtimeline = async (row: any) => { 
    // 审批记录（兼容多种字段）
@@ -443,7 +517,9 @@
    display: flex;
    align-items: center;
  }
-  .clickable { cursor: pointer; }
+  .clickable {
+    cursor: pointer;
+  }
  .status-following {
    color: #00a43f;
    font-weight: bold;
@@ -42,11 +42,15 @@
          <ElTableColumn label="状态" prop="approval_status">
            <template #default="scope">
              <div v-if="scope.row.appro_status">
-                <div
-                  ><span :class="statusClass(scope.row.appro_status.status)">{{ scope.row.appro_status.status_desc ? scope.row.appro_status.status_desc : '' }}</span>
-                  <span v-if="scope.row.appro_status.name != ''"
-                    >【{{ scope.row.appro_status.name }}】</span
-                  >
+                <div>
+                  <span :class="statusClass(scope.row.appro_status.status)">
+                    {{
+                      scope.row.appro_status.status_desc
+                        ? scope.row.appro_status.status_desc
+                        : ''
+                    }}
+                  </span>
+                  <span v-if="scope.row.appro_status.name != ''">【{{ scope.row.appro_status.name }}】</span>
                </div>
              </div>
              <div v-else></div>
@@ -68,7 +72,7 @@
                  type="success"
                  underline="never"
                  @click="handleView(scope.row)"
-                  style="margin-right: 8px;color: #333333;"
+                  style="margin-right: 8px; color: #333333"
                >
                  <i class="iconfont-sys">&#xe76c;</i> 查看
                </el-link>
@@ -77,12 +81,26 @@
                  type="success"
                  underline="never"
                  @click="handleView1(scope.row)"
+                  style="margin-right: 8px"
                >
                  <i class="iconfont-sys">&#xe76c;</i> 查看终版
                </el-link>
-                <el-link type="warning" underline="never" @click="showDialogtimeline(scope.row)">
+                <el-link
+                  type="warning"
+                  underline="never"
+                  @click="showDialogtimeline(scope.row)"
+                  style="margin-right: 8px"
+                >
                  <i class="iconfont-sys">&#xe728;</i> 查看审批
                </el-link>
+                <el-link
+                  type="primary"
+                  underline="never"
+                  @click="handleViewnq(scope.row)"
+                  style="margin-right: 8px;color: #750AF8;"
+                >
+                  <i class="iconfont-sys">&#xe76c;</i> 内勤专用
+                </el-link>
              </ElRow>
            </template>
          </ElTableColumn>
@@ -162,6 +180,12 @@
        <ApprovalTimeline :records="approvalRecords" />
      </div>
    </el-dialog>
+    <!-- 内勤查看弹窗 -->
+    <InternalStaffView
+      v-model:visible="nqDialogVisible"
+      :vehicle-data="nqData"
+      :default-currency="nqCurrency"
+    />
  </div>
 </template>

@@ -172,8 +196,12 @@
  import ApprovalTimeline from '@/components/custom/ApprovalTimeline.vue'
  import type { OrderData } from '@/composables/useOrderDetailDialog'
  import FilePreview from '@/components/custom/FilePreview.vue'
+  import InternalStaffView from '@/components/custom/InternalStaffView.vue'
  const timelineDialogVisible = ref(false)
  const approvalRecords = ref<any[]>([])
+  const nqDialogVisible = ref(false)
+  const nqCurrency = ref('')
+  const nqData = ref<any[]>([])
  const isFinites = ref(false)
  defineOptions({ name: 'StockingListAdmin' })
  // import { useAuth } from '@/composables/useAuth'
@@ -192,11 +220,12 @@
  const pagination = reactive({ currentPage: 1, pageSize: 10, total: 0 })

  // PDF 预览/打印（公共）
-  const { pdf, frameRef, openWithResponse, download, print, preparePreview, prepareImages } = usePdfPreview()
+  const { pdf, frameRef, openWithResponse, download, /* print,*/ preparePreview, prepareImages } = usePdfPreview()

  onMounted(() => {
    getList()
  })
+
  function statusClass(status: any) {
    if (status === 'rejected' || status === 'voided') return 'status-lost'
    if (status === 'approved') return 'status-following'
@@ -327,7 +356,7 @@
    }
  }
  // 判断是否为图片文件
-  const isImageFile = (file: { name: string; url: string; file_name: string }) => {
+  /* const isImageFile = (file: { name: string; url: string; file_name: string }) => {
    // 检查文件名
    if (file.name && /\.(jpg|jpeg|png|gif|webp)$/i.test(file.name)) {
      return true
@@ -347,10 +376,10 @@
    }
    
    return false
-  }
+  } */

  // 预览图片
-  const previewImage = (file: { name: string; url: string; file_name: string }) => {
+  /* const previewImage = (file: { name: string; url: string; file_name: string }) => {
    // 创建图片预览弹窗
    const imagePreview = document.createElement('div')
    imagePreview.style.cssText = `
@@ -413,10 +442,10 @@
      }
    }
    document.addEventListener('keydown', handleKeydown)
-  }
+  } */

  // 下载文件
-  const downloadFile = (file: { name: string; url: string; file_name: string }) => {
+  /* const downloadFile = (file: { name: string; url: string; file_name: string }) => {
    try {
      const link = document.createElement('a')
      link.href = file.url
@@ -429,7 +458,7 @@
      console.error('下载失败:', error)
      ElMessage.error('下载失败，请稍后重试')
    }
-  }
+  } */
  //打印
  const printfn = (row: any) => {
    if (row.approval_status == 2) {
@@ -472,6 +501,37 @@
    }
    timelineDialogVisible.value = true
  }
+  const handleViewnq = async (row: any) => {
+    const res = await manageService.checkStock({ id: row.id })
+    // 设置默认币种为数据中的 currency_symbol
+    if (res?.currency_symbol) {
+      nqCurrency.value = res.currency_symbol
+    } else {
+      nqCurrency.value = 'USD' // 兜底默认值
+    }
+    // 取车辆明细列表作为行
+    const list = Array.isArray(res?.veh_list) ? res.veh_list : []
+    nqData.value = list.map((it: any) => ({
+      model_snapshot: it.model_snapshot,
+      qty: 1,
+      clearance_price: it.clearance_price,
+      clearance_price_currency: it.clearance_price?.currency || it.clearance_price_currency,
+      fob_transport_fee: it.fob_transport_fee,
+      fob_fee_currency: it.fob_transport_fee?.currency || it.fob_fee_currency,
+      car_price: it.car_price,
+      car_price_currency: it.car_price?.currency || it.car_price_currency,
+      ocean_freight: it.ocean_freight,
+      ocean_freight_currency: it.ocean_freight?.currency || it.ocean_freight_currency,
+      commission: it.commission,
+      commission_currency: it.commission?.currency || it.commission_currency,
+      retention_price: it.retention_price,
+      retention_price_currency: it.retention_price?.currency || it.retention_price_currency,
+      port_misc_fee: it.port_misc_fee,
+      port_fee_currency: it.port_misc_fee?.currency || it.port_fee_currency,
+      model: it.model_snapshot
+    }))
+    nqDialogVisible.value = true
+  }
 </script>

 <style scoped lang="scss">
@@ -496,7 +556,9 @@
    display: flex;
    align-items: center;
  }
-  .clickable { cursor: pointer; }
+  .clickable {
+    cursor: pointer;
+  }
  .status-following {
    color: #00a43f;
    font-weight: bold;
@@ -82,7 +82,12 @@
              >
                <i class="iconfont-sys">&#xe641;</i> 提交
              </el-link>
-              <el-link type="primary" underline="never" @click="handleView1(scope.row)">
+              <el-link
+                type="primary"
+                underline="never"
+                @click="handleView1(scope.row)"
+                style="margin-right: 8px"
+              >
                <i class="iconfont-sys">&#xe76c;</i> 查看终版
              </el-link>
              <el-link type="warning" underline="never" @click="showDialogtimeline(scope.row)">
@@ -88,7 +88,7 @@
                  type="success"
                  underline="never"
                  @click="handleView(scope.row)"
-                  style="margin-right: 8px;color: #333333;"
+                  style="margin-right: 8px;color: #750AF8;"
                >
                  <i class="iconfont-sys">&#xe76c;</i> 查看
                </el-link>