pod修改

04886f0f · zhuzhequan · 8e1db597 · 04886f0f · 04886f0f · 04886f0f
Commit 04886f0f authored Mar 07, 2025 by zhuzhequan
Show whitespace changes
Inline Side-by-side

Showing with 238 additions and 5 deletions

src/api/podOrder.ts
+18 -0

src/components/TableView.vue
+13 -2

src/views/order/pod/index.vue
+111 -3

src/views/order/pod/rightMenu.vue
+96 -0

No files found.
--- a/src/api/podOrder.ts
+++ b/src/api/podOrder.ts
@@ -183,3 +183,21 @@ export function updateRemarkApi(id: number, remark: string) {
    },
  )
 }
+export function getInProductionCount(productionFileId: unknown, baseSku: unknown) {
+  return axios.post<never, BaseRespData<never>>(
+    'factory/podJomallOrderProduct/getInProductionCount',
+    {
+      productionFileId,
+      baseSku
+    },
+  )
+}
+export function getWaitShipmentCount(productionFileId: unknown, baseSku: unknown) {
+  return axios.post<never, BaseRespData<never>>(
+    'factory/podJomallOrderProduct/getWaitShipmentCount',
+    {
+      productionFileId,
+      baseSku
+    },
+  )
+}
--- a/src/components/TableView.vue
+++ b/src/components/TableView.vue
 <template>
  <div class="table-view">
    <ElTable
+      ref="tableRef"
      :data="paginatedData"
      border
      :stripe="stripe"
@@ -10,6 +11,7 @@
    >
      <template v-for="column in columns" :key="column.key">
        <ElTableColumn
          v-if="
            column.type === 'index' ||
            column.type === 'selection' ||
@@ -20,6 +22,7 @@
        >
          <!-- 当type等于expand时， 配置通过h函数渲染、txs语法或者插槽自定义内容 -->
          <template #default="scope">
+            <div @contextmenu.prevent="(e)=>$emit('rightClick',e)">
              <component
                :is="column.render"
                v-if="column.render"
@@ -32,11 +35,13 @@
                :row="scope.row"
                :index="scope.$index"
              ></slot>
+            </div>
          </template>
        </ElTableColumn>
        <RenderColumn v-else :col="column">
          <template v-for="(_, name) of slots" #[name]="scope">
-            <slot :name="name" v-bind="scope" />
+            <slot @contextmenu.prevent="(e)=>$emit('rightClick',e)" :name="name" v-bind="scope" />
          </template>
        </RenderColumn>
      </template>
@@ -44,9 +49,11 @@
  </div>
 </template>
 <script setup lang="tsx" generic="T">
-import { type Slot, useAttrs, useSlots, type PropType } from 'vue'
+import { type Slot, useAttrs, useSlots, type PropType, shallowRef } from 'vue'
 import type { CustomColumn } from '@/types/table'
 import RenderColumn from './RenderColumn.vue'
+import { ElTable } from 'element-plus'
+const tableRef = shallowRef<InstanceType<typeof ElTable>>();
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 defineProps({
  paginatedData: {
@@ -64,6 +71,10 @@ defineProps({
 })
 const attrs = useAttrs()
 const slots = useSlots() as Record<string, Slot>
+defineExpose({
+  tableRef
+})
 </script>
 <style lang="scss" scoped>

--- a/src/views/order/pod/index.vue
+++ b/src/views/order/pod/index.vue
@@ -169,6 +169,7 @@
          v-if="status === 'WAIT_SHIPMENT' || status === 'PART_SHIPPING'"
          class="item"
        >
          <ElButton type="success" @click="confirmDelivery">发货</ElButton>
        </span>
        <!-- <span v-if="status === 'IN_PRODUCTION'" class="item">
@@ -189,6 +190,7 @@
            <CardWrapper
              :card-item="cardItem"
              :class="{ active: isSelectStatused(cardItem) }"
+              @contextmenu.prevent="(v)=>rightClick(v,cardItem)"
            >
              <!-- <template #top_right> 工厂类型 </template> -->
              <template #bottom_left>
@@ -403,10 +405,12 @@
        class="order-list flex-1 overflow-hidden"
      >
        <TableView
+          ref="tableRef"
          :paginated-data="tableData"
          :columns="tableColumns"
-          default-expand-all
          :span-method="arraySpanMethod"
+          default-expand-all
+          @right-click="rightClick"
          @selection-change="handleSelectionChange"
        >
          <template #expand="{ row }">
@@ -603,6 +607,7 @@
          </template>
        </TableView>
      </div>
+      <right-menu :show_copy_shop_number="['IN_PRODUCTION','WAIT_SHIPMENT'].includes(status)" ref="rightMenuRef" @change="rightChange" />
      <el-pagination
        v-model:current-page="currentPage"
        v-model:page-size="pageSize"
@@ -723,6 +728,14 @@
  >
    <LogList :log-list="logList" />
  </el-dialog>
+  <el-dialog
+    v-model="countVisible"
+    title="数据统计"
+    width="400px"
+    :close-on-click-modal="false"
+  >
+  <p>基版 <b>{{cardItem?.baseSku}}</b> 的统计数量为：<b> {{count}}</b></p>
+  </el-dialog>
  <fastProduction
    v-model:detailVisible="detailVisible"
    :title="fastTitle"
@@ -735,6 +748,8 @@
 </template>
 <script setup lang="tsx">
 // refreshJMProductInfo,reasonInvalidationApi,
+import RightMenu from './rightMenu.vue'
 import {
  getOrderTabData,
  getOrderList,
@@ -748,6 +763,8 @@ import {
  updateRemarkApi,
  getCardOrderList,
  getOrderDetail,
+  getInProductionCount,
+  getWaitShipmentCount,
 } from '@/api/podOrder'
 import TableView from '@/components/TableView.vue'
 import {
@@ -782,13 +799,62 @@ import { ElButton, type FormRules } from 'element-plus'
 import { showConfirm } from '@/utils/ui'
 import { filePath } from '@/api/axios'
 import LogList from '@/components/LogList.vue'
+const tableRef =  ref();
+const keyCode =  ref('');
+const cardItem =  ref<PodProductList | CardOrderData>();
+const rightMenuRef = ref()
+const count = ref<number>(0)
+const rightClick = (e:MouseEvent,item:PodProductList | CardOrderData) => {
+  cardItem.value = item
+  rightMenuRef.value.setPosition({
+    x: e.clientX,
+    y: e.clientY,
+    cardItem: e.clientY,
+    el: e
+  })
+}
+const rightChange =async (code:string) => {
+  const flag = ['IN_PRODUCTION','WAIT_SHIPMENT'].includes(status.value)
+  if (code === 'check_all') {
+    if(flag){
+      selection.value = JSON.parse(JSON.stringify(CardOrderList.value))
+    } else{
+      if( tableRef.value && tableRef.value?.tableRef){
+        tableRef.value?.tableRef.toggleAllSelection()
+      }
+      // selection.value = JSON.parse(JSON.stringify(tableData.value))
+    }
+  } else if (code === 'clear_check') {
+    selection.value = []
+    tableRef.value?.tableRef.toggleAllSelection()
+  } else if (code === 'copy_code') {
+    const str = selection.value.map(item=>item.factorySubOrderNumber || item.factoryOrderNumber).join()
+    navigator.clipboard.writeText(str)
+    ElMessage.success('复制成功')
+  }  else if (code === 'copy_shopNumber') {
+    const str = selection.value.map(item=>item.shopNumber).join()
+    navigator.clipboard.writeText(str)
+    ElMessage.success('复制成功')
+  } else if (code === 'count') {
+    countVisible.value = true
+    let res
+    if(status.value==='WAIT_SHIPMENT'){
+       res =  await getWaitShipmentCount(cardItem.value?.productionFileId,cardItem.value?.baseSku)
+    }else if(status.value==='IN_PRODUCTION'){
+       res =   await getInProductionCount(cardItem.value?.productionFileId,cardItem.value?.baseSku)
+    }
+    count.value = (res?.data || 0) as number
+  }
+}
 // 日期工具函数
-const getDateRange = (days = 0, type: 'past' | 'future' = 'past') => {
+const
+  getDateRange = (days = 0, type: 'past' | 'future' = 'past') => {
    const end = dayjs()
    const start =
      type === 'past' ? end.subtract(days, 'day') : end.add(days, 'day')
    return [start.startOf('day').toDate(), end.endOf('day').toDate()]
-}
+  }
 const getMonthRange = (months = 0, type: 'past' | 'future' = 'past') => {
  const now = dayjs()
@@ -854,6 +920,7 @@ const pickerOptions = {
 const timeRange = ref<string[]>([])
 const tabsNav = ref<Tab[]>()
 const status = ref('TO_BE_CONFIRMED')
 const [tableWrapperRef, thOrderDetailWidth, updateColumnWidth] =
  useElTableColumnWidth('table th.th-order-detail')
 const loadTabData = async () => {
@@ -965,6 +1032,7 @@ const handleChangeImages = (
 const fastTitle = ref('')
 const detailData = ref({})
 const detailVisible = ref(false)
+const countVisible = ref(false)
 const fastType = ref<number>(-1)
 const fastToProduction = (title: string, type: number) => {
  detailData.value = {}
@@ -974,6 +1042,18 @@ const fastToProduction = (title: string, type: number) => {
 }
 const cardClick = (data: PodProductList | CardOrderData) => {
  const status = isSelectStatused(data)
+  if(keyCode.value==='Shift'){
+    if(selection.value.length){
+      const startIndex=CardOrderList.value.findIndex(el=>el.id===selection.value[0].id)
+      const endIndex = CardOrderList.value.findIndex(el=>el.id===data.id)
+      selection.value =[]
+      for(let k =startIndex;k<=endIndex;k++ ){
+        selection.value.push(JSON.parse(JSON.stringify(CardOrderList.value[k])))
+      }
+    }
+  }
  if (status) {
    selection.value = selection.value.filter(
      (item: CardOrderData | PodProductList) => item.id !== data.id,
@@ -1475,7 +1555,12 @@ const getSafeImages = (item: PodProductList | CardOrderData): cardImages[] => {
  if (!item.images) return []
  return item.images as cardImages[]
 }
+const listenerKeydown= (e:KeyboardEvent) => {
+  console.log(e)
+  keyCode.value = e?.key
+}
 onMounted(() => {
+  document.addEventListener('keydown', listenerKeydown)
  getLogisticsList()
  loadTabData()
 })
@@ -1487,21 +1572,25 @@ onMounted(() => {
    margin-bottom: 10px;
  }
 }
 .card-mode {
  padding-top: 10px;
  overflow: auto;
  .card-list {
    flex: 1;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: max-content;
    gap: 10px;
    .card-list_item {
      border: 1px solid #eee;
      border-top-left-radius: 10px;
      background-color: #eee;
      overflow: hidden;
      cursor: pointer;
      .base_sku {
        background: rgba(255, 255, 255, 0.699);
        font-size: 12px;
@@ -1514,20 +1603,24 @@ onMounted(() => {
        padding: 3px 5px;
        border-radius: 2px;
      }
      .flex-between {
        display: flex;
        justify-content: space-between;
        align-items: center;
        .images-position {
          display: flex;
          height: 30px;
          gap: 10px;
          padding: 10px 6px 0;
          .item-image {
            width: 30px;
            height: 30px;
            border: 1px solid #909399;
            cursor: pointer;
            img {
              width: 100%;
              height: 100%;
@@ -1535,6 +1628,7 @@ onMounted(() => {
            }
          }
        }
        b {
          margin-right: 5px;
          font-size: 15px;
@@ -1587,6 +1681,7 @@ onMounted(() => {
    }
  }
 }
 .order-list-expand {
  border-right: 1px solid #eee;
  font-size: 14px;
@@ -1594,6 +1689,7 @@ onMounted(() => {
  overflow: auto;
  max-height: 600px;
 }
 .table-expand {
  display: flex;
 }
@@ -1606,6 +1702,7 @@ onMounted(() => {
    cursor: pointer;
  }
 }
 .order-list {
  margin-top: 10px;
  flex: 1;
@@ -1622,10 +1719,12 @@ onMounted(() => {
    padding: 0;
  }
 }
 .order-detail {
  display: flex;
  font-size: 14px;
 }
 .order-detail_item {
  flex: 1;
  display: flex;
@@ -1644,10 +1743,12 @@ onMounted(() => {
    white-space: nowrap;
  }
 }
 .order-actual-payment {
  width: 280px;
  border-right: 1px solid #eee;
 }
 .order-memo {
  width: 300px;
  border-right: 1px solid #eee;
@@ -1657,6 +1758,7 @@ onMounted(() => {
  padding: 20px;
  font-size: 14px;
 }
 .order-memo-item__content,
 .order-memo-item__time {
  white-space: nowrap;
@@ -1678,10 +1780,12 @@ onMounted(() => {
 .order-memo-item div:not(:last-child) {
  margin-right: 6px;
 }
 .order-time {
  width: 300px;
  border-right: 1px solid #eee;
 }
 .order-operate {
  width: 100px;
 }
@@ -1708,13 +1812,16 @@ onMounted(() => {
 .dialog-footer {
  text-align: center;
 }
 .order-detail_goods-info--content {
  padding: 10px 0;
  font-size: 14px;
  :deep(.order-list-expand_item) {
    padding: 10px 0;
  }
 }
 .order-list-expand_item_info_title {
  line-height: 26px;
  display: flex;
@@ -1724,6 +1831,7 @@ onMounted(() => {
 .order-list-expand_item_label {
  margin-right: 6px;
 }
 .order-operate_info {
  padding: 20px;

--- a/src/views/order/pod/rightMenu.vue
+++ b/src/views/order/pod/rightMenu.vue
+<template>
+  <!-- <div  class="wrap" @click="close"> -->
+  <div v-if="show" ref="right_menu" class="right_menu">
+    <button @click="$emit('change', 'check_all')">
+      全部选择
+    </button>
+    <button @click="$emit('change', 'clear_check')">取消选择</button>
+    <button @click="$emit('change', 'copy_code')">复制选中生产单号</button>
+    <button v-if="show_copy_shop_number" @click="$emit('change', 'copy_shopNumber')">复制选中店铺单号</button>
+    <button v-if="show_copy_shop_number" @click="$emit('change', 'count')">统计数量</button>
+  </div>
+  <!-- </div> -->
+</template>
+<script setup lang="ts">
+import {ref,defineProps,defineExpose} from 'vue'
+interface E{
+  x:number
+  el:HTMLElement
+  y:number
+}
+defineProps({
+  show_copy_shop_number:{
+    type:Boolean,
+    default:true
+  }
+})
+const row = ref()
+const show = ref(false)
+const right_menu = ref<HTMLElement>()
+const close = ()=>{
+  show.value = false
+  document.body.onclick = null
+}
+const setPosition = (o:E)=> {
+  console.log(o)
+  show.value = true
+  const clientX = o.x
+  const x = document.body.clientWidth - clientX
+  document.body.onclick = function () {
+    close()
+  }
+  row.value =
+  setTimeout(() => {
+    if(!right_menu.value) return
+    if (x < 150) {
+      right_menu.value.style.cssText = `top:${o.y}px;right:${x}px`
+    } else {
+     right_menu.value.style.cssText = `top:${o.y}px;left:${o.x}px`
+    }
+  }, 1)
+}
+defineExpose({
+  setPosition
+})
+</script>
+<style scoped>
+.wrap {
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+}
+.right_menu {
+  position: fixed;
+  max-width: 200px;
+  min-height: 50px;
+  background: #fff;
+  box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.5);
+  border-radius: 5px;
+  overflow: hidden;
+  z-index: 999;
+  /* left: -500px; */
+  top: -500px;
+}
+.right_menu button {
+  display: block;
+  line-height: 30px;
+  font-size: 14px;
+  padding: 0 15px;
+  text-align: left;
+  width: 100%;
+  cursor: pointer;
+}
+.right_menu button:hover {
+  background: rgb(65, 192, 251);
+  color: white;
+}
+button{
+  outline: none;
+  border: none;
+}
+</style>