Skip to content

F
factory_front
Commit 8eff2f62 by linjinhong
Options

添加podus卡片和列表显示类型，播种墙更改图片展示

parent 6abe966b
Showing with 253 additions and 49 deletions
src/types/api/podMakeOrder.ts
......@@ -45,4 +45,5 @@ export interface ProductList {
power?: boolean
variantImage?: string
podJomallUsNo?: string
previewImgs?: { sort: string | number; title: string; url: string }[]
}
src/views/order/orderTracking/index.vue
......@@ -13,6 +13,7 @@ import {
getOrderList,
getOperationLogApi,
getOrderTabData,
getfaceSimplexFileApi,
} from '@/api/podUsOrder'
import {
SearchForm,
......@@ -28,6 +29,11 @@ import dayjs from 'dayjs'
import { getUserMarkList } from '@/api/common'
import { CaretBottom, CaretTop } from '@element-plus/icons-vue'
import SplitDiv from '@/components/splitDiv/splitDiv.vue'
import { BaseRespData } from '@/types/api'
import { showConfirm } from '@/utils/ui'
import { isArray, isString } from '@/utils/validate'
import ResultInfo from '../podUs/components/ResultInfo.vue'
import { filePath } from '@/api/axios'
import { useValue } from '@/utils/hooks/useValue'
......@@ -162,13 +168,7 @@ const goodsColumns = computed(() => {
align: 'center',
showOverflowTooltip: true,
},
{
label: '状态',
prop: 'subStatus',
width: 130,
align: 'center',
showOverflowTooltip: true,
},
{
label: '生产单号',
prop: 'factorySubOrderNumber',
......@@ -246,6 +246,18 @@ const goodsColumns = computed(() => {
},
{
label: '数量',
prop: 'num',
width: 100,
align: 'center',
},
{
label: '未生产数量',
prop: 'notPassNum',
width: 100,
align: 'center',
},
{
label: '补胚数量',
prop: 'replenishmentSumNum',
width: 100,
......@@ -270,6 +282,7 @@ const goodsData = ref<ProductList[]>([])
const searchVisible = ref(false)
const goodsLoading = ref(false)
const logList = ref<LogListData[]>([])
const selection = ref<PodUsOrderListData[]>([])
const warehouseList = ref<warehouseInfo[]>([])
const timeRange = ref<string[]>([])
......@@ -400,6 +413,8 @@ const loadCraftList = async () => {
console.error(e)
}
}
const tableRef = ref()
const getOrderListFn = async () => {
const loading = ElLoading.service({
fullscreen: true,
......@@ -415,6 +430,12 @@ const getOrderListFn = async () => {
)
tableData.value = data.records
pagination.value.total = data.total
if (tableData.value?.length) {
nextTick(async () => {
await tableRef.value?.setCurrentRow(tableData.value[0])
rowClick(tableData.value[0] as unknown as PodUsOrderListData)
})
}
} catch (e) {
console.error(e)
} finally {
......@@ -469,6 +490,90 @@ function getStatus(status: string) {
return ''
}
const resultInfo = ref<
{
id: string | number
status: boolean
factoryOrderNumber?: string
message: string
}[]
>([])
const resultRefs = ref<InstanceType<typeof ResultInfo> | null>(null)
/**
* @description: 创建物流、获取跟踪号、获取打印面单、更改物流、取消物流订单
*/
const getOrderByIdApi = async (type: string) => {
if (selection.value.length === 0) {
return ElMessage.warning('请选择数据')
}
const operationMap: {
[key: string]: {
message: string
Fn: (orderIds: (string | number)[]) => Promise<BaseRespData<never>>
}
} = {
getPrintOrder: { message: '获取打印面单', Fn: getfaceSimplexFileApi },
}
let loading
const operation = operationMap[type]
if (operation) {
try {
await showConfirm(`确定对该订单 ${operation.message}?`, {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
})
const ids = selection.value.map((el) => el.id)
loading = ElLoading.service({
fullscreen: true,
text: '操作中...',
background: 'rgba(0, 0, 0, 0.3)',
})
const res = await operation.Fn(ids)
if (res.code === 200) {
if (isArray(res.data)) {
resultInfo.value =
(res.data as {
id: string | number
status: boolean
factoryOrderNumber?: string
message: string
}[]) || []
resultRefs.value?.showDialog()
console.log(33)
} else if (isString(res.data)) {
window.open(filePath + res.data)
}
} else {
ElMessage.error(res.message)
}
} catch (e) {
resultInfo.value = []
console.error(e)
} finally {
loading && loading.close()
}
} else {
ElMessage.warning('未知操作类型')
}
}
const resultConfirm = () => {
search()
loadTabData()
}
const handleSelectionChange = (val: PodUsOrderListData[]) => {
selection.value = val
}
watch(
() => currentRowId.value,
(newValue, oldValue) => {
......@@ -770,6 +875,13 @@ onMounted(() => {
<ElButton type="primary" @click="search">查询</ElButton>
</span>
</ElFormItem>
<ElFormItem>
<span>
<ElButton type="primary" @click="getOrderByIdApi('getPrintOrder')"
>获取打印面单</ElButton
>
</span>
</ElFormItem>
</ElForm>
</el-card>
</template>
......@@ -787,6 +899,7 @@ onMounted(() => {
:paginated-data="tableData"
highlight-current-row
@row-click="rowClick"
@selection-change="handleSelectionChange"
>
<template #status="{ row }">
<div>{{ getStatus(row.status) }}</div>
......@@ -818,7 +931,7 @@ onMounted(() => {
<el-tabs>
<el-tab-pane label="商品明细">
<TableView
ref="tableRef"
ref="goodsRef"
v-loading="goodsLoading"
:columns="goodsColumns"
:serial-numberable="true"
......@@ -840,6 +953,11 @@ onMounted(() => {
</div>
</template>
</split-div>
<ResultInfo
ref="resultRefs"
:list="resultInfo"
@confirm="resultConfirm"
></ResultInfo>
</template>
<style scoped lang="scss">
......
src/views/order/podUs/PodMakeOrder.vue
......@@ -110,10 +110,21 @@
:columns="podOrderDetailsColumns"
highlight-current-row
@row-click="handleRowClick"
@current-change="handleCurrentChange"
>
<template #image="{ row }">
<img :src="row.variantImage" alt="" />
<div
style="display: flex; flex-wrap: nowrap"
v-if="row.previewImgs?.length"
>
<div
v-for="img in row.previewImgs"
:key="img"
@click="handleCurrentChange(img.url)"
style="cursor: pointer; margin-right: 5px"
>
<img v-if="img.url" :src="img.url" alt="" />
</div>
</div>
</template>
<template #verifyResult="{ row }">
<el-icon
......@@ -214,7 +225,7 @@ import type { WebSocketMessage } from '@/utils/websocket'
import {
OrderData,
PodMakeOrderData,
ProductList,
// ProductList,
} from '@/types/api/podMakeOrder'
import useOrderStore from '@/store/order'
import {
......@@ -254,17 +265,23 @@ const podOrderDetailsColumns = computed(() => [
{
label: '图片',
prop: 'image',
width: 60,
width: 250,
slot: 'image',
align: 'center',
fixed: 'left',
},
{
label: 'base SKU',
prop: 'baseSku',
width: 140,
label: '生产单号',
prop: 'podJomallUsNo',
width: 150,
align: 'center',
},
// {
// label: 'base SKU',
// prop: 'baseSku',
// width: 140,
// align: 'center',
// },
{
label: 'variant SKU',
prop: 'variantSku',
......@@ -277,12 +294,6 @@ const podOrderDetailsColumns = computed(() => [
},
{
label: '生产单号',
prop: 'podJomallUsNo',
width: 150,
align: 'center',
},
{
label: '购买数量',
prop: 'purchaseNumber',
width: 90,
......@@ -317,6 +328,7 @@ watch(visible, async (value: boolean) => {
currentCode = ''
warehouseId.value = props.warehouseList[0].id
_warehouseId.value = props.warehouseList[0].id
if (userStore.user?.factory.id) {
try {
await socket.init(
......@@ -338,6 +350,8 @@ watch(visible, async (value: boolean) => {
initOrderDetailBox()
initPrintDevice()
const locaclPrinter = localStorage.getItem('sheetPrinter')
if (locaclPrinter) sheetPrinter.value = JSON.parse(locaclPrinter)
} else {
if (userStore.user?.factory.id) {
socket.send({
......@@ -351,7 +365,6 @@ watch(visible, async (value: boolean) => {
})
watch(boxIndex, (value: number | null) => {
if (value) {
console.log('boxIndex', value, boxChange.value)
const bool = !boxChange.value
boxChange.value = false
renderItemBox(bool)
......@@ -375,6 +388,7 @@ watch(
},
{ deep: true },
)
const podBoxIndex = computed(() => orderStore.podBoxIndex)
let renderLock = false
......@@ -392,6 +406,9 @@ const renderItemBox = (bool: boolean) => {
let boxItem = podBoxList.value.find((item) => item.box === boxIndex.value)
if (!boxItem) boxItem = { data: { productList: [] } }
const { data } = boxItem
data?.productList?.forEach((el) => {
if (!el.previewImgs) el.previewImgs = JSON.parse(el.imageAry)
})
if (!data) {
renderLock = false
currentCode = ''
......@@ -399,11 +416,12 @@ const renderItemBox = (bool: boolean) => {
return
}
const { productList = [] } = data
const pickingNumber = productList.reduce((prev, product) => {
return prev + (product.count || 0)
}, 0)
data.pickingNumber = pickingNumber
coverImage.value = productList[0].variantImage || ''
coverImage.value = productList[0].previewImgs?.[0]?.url || ''
for (const product of productList) {
if (product.count === product.purchaseNumber) {
product.power = true
......@@ -419,7 +437,9 @@ const renderItemBox = (bool: boolean) => {
: parts[0]
for (const product of productList) {
if (product.podJomallUsNo === currentCode) {
coverImage.value = product.variantImage || ''
coverImage.value = product.previewImgs?.[0]?.url || ''
console.log(441, coverImage.value)
nextTick(() => {
tableRef.value?.setCurrentRow(product)
})
......@@ -428,7 +448,9 @@ const renderItemBox = (bool: boolean) => {
}
currentCode = ''
}
podOrderDetailsData.value = data
if (productList.every((item) => item.power)) {
print(data, false, () => {
renderLock = false
......@@ -552,6 +574,8 @@ const getPackingData = async (code: string) => {
return
}
const { box } = res.data
console.log('box', box)
if (box) {
boxIndex.value = box
}
......@@ -647,8 +671,8 @@ const initOrderDetailBox = async () => {
boxList.find((item) => item.data)?.data || undefined
boxIndex.value = boxList.find((item) => item.data)?.box || null
coverImage.value =
boxList.find((item) => item.data)?.data?.productList?.[0]?.variantImage ||
''
boxList.find((item) => item.data)?.data?.productList?.[0]
?.previewImgs?.[0].url || ''
if (
podOrderDetailsData.value &&
podOrderDetailsData.value.pickingNumber ===
......@@ -871,9 +895,9 @@ const clearAllBox = async () => {
const handleRowClick = () => {
productionOrderRef.value.focus()
}
const handleCurrentChange = (row: ProductList) => {
if (row) {
coverImage.value = row.variantImage || ''
const handleCurrentChange = (url: string) => {
if (url) {
coverImage.value = url || ''
}
}
const warehouseId = ref<string | number>('')
......
src/views/order/podUs/components/ResultInfo.vue
......@@ -131,16 +131,12 @@ function closedFn() {
}
// 监听弹窗状态
// watch(
// () => resultDialog.value,
// (v) => {
// if (v) {
// console.log(127, props.list)
// resultfilter(true)
// }
// },
// )
watch(
() => resultDialog.value,
(v) => {
console.log(v)
},
)
watch(
() => props.list,
(v) => {
......
src/views/order/podUs/index.vue
......@@ -608,6 +608,17 @@
>
<div class="goods-item-img">
<img :src="item.variantImage" alt="商品图片" />
<div
v-if="item.customizedQuantity"
class="triangle-box"
:title="`类型:${getQuantityText(
item.customizedQuantity,
)}面`"
>
<div class="multi-text">
{{ getQuantityText(item.customizedQuantity) }}
</div>
</div>
</div>
<div class="goods-item-info">
<div class="goods-item-info-item">
......@@ -1251,10 +1262,19 @@
style="height: 30px"
/>
</div>
<div
v-if="cardItem?.customizedQuantity"
class="customizedQuantity"
:title="`类型:${getQuantityText(
cardItem?.customizedQuantity,
)}面`"
>
{{ getQuantityText(cardItem?.customizedQuantity) }}
</div>
<Icon
name="caozuorizhi"
@click="(e: MouseEvent) => operationLog(cardItem.podJomallOrderUsId, e)"
style="width: 28px; height: 28px"
>
<template #title>
<title>操作日志</title>
......@@ -1278,7 +1298,11 @@
class="item-image"
@mousemove="handleChangeImages(item, cardItem)"
>
<img :src="item?.url" height="28" />
<img
:src="item?.url"
height="28"
@click="handlePictureCardPreview(item?.url)"
/>
</div>
</div>
</div>
......@@ -1849,6 +1873,9 @@
</span>
</template>
</ElDialog>
<el-dialog v-model="dialogVisible" width="35%">
<img :src="dialogImageUrl" alt="商品预览图片" />
</el-dialog>
</template>
<script setup lang="ts">
import { getUserMarkList } from '@/api/common'
......@@ -2051,7 +2078,7 @@ const logisticsWayData = ref([])
const searchVisible = ref(false)
const confirmSelectionData = ref<LogisticsData[]>([])
const confirmRowData = ref<ProductList | null>(null)
const status = ref('TO_BE_CONFIRMED')
const status = ref(localStorage.getItem('podUsStatus') || 'TO_BE_CONFIRMED')
const detailData = ref({})
const [searchForm, resetSearchForm] = useValue<SearchForm>({
......@@ -3611,7 +3638,10 @@ const logisticsToPicking = async () => {
}
const sheetPrinter = ref('')
const handlePrinterChange = (value: string) => {
console.log('value', value)
sheetPrinter.value = value
localStorage.setItem('sheetPrinter', JSON.stringify(value))
}
const { getCLodop } = useLodop()
const printOrder = async (
......@@ -3887,12 +3917,6 @@ watch(
)
onMounted(() => {
const podUsStatus = localStorage.getItem('podUsStatus')
if (podUsStatus) {
status.value = podUsStatus
}
loadTabData()
getUserMark()
loadProductionClient()
......@@ -4091,6 +4115,17 @@ function getPlatformImg(code: string) {
return ''
}
function getQuantityText(qty: number) {
if (!qty || qty <= 0) return ''
return Math.floor(qty) === 1 ? '单' : '多'
}
const dialogVisible = ref(false)
const dialogImageUrl = ref('')
const handlePictureCardPreview = (fileUrl: string) => {
dialogImageUrl.value = fileUrl
dialogVisible.value = true
}
// 全局 loading 改为每行 loading map
const reComposingLoadingMap = reactive<{ [key: number]: boolean }>({})
......@@ -4164,7 +4199,7 @@ useRouter().beforeEach((to, from, next) => {
.goods-item-img {
width: 100px;
height: 100px;
position: relative;
img {
width: 100%;
}
......@@ -4400,6 +4435,36 @@ useRouter().beforeEach((to, from, next) => {
align-items: center;
justify-content: flex-start;
}
.customizedQuantity {
height: 28px;
width: 28px;
color: #f56c6c;
text-align: center;
line-height: 24px;
background-color: #fff;
border: 2px solid #f56c6c;
border-radius: 7px;
margin-right: 2px;
font-weight: 700;
box-sizing: border-box;
}
.triangle-box {
position: absolute;
top: 0;
right: 0;
width: 0;
height: 0;
border: 18px solid transparent;
border-top: 18px solid #e74c3c;
border-right: 18px solid #e74c3c;
}
.multi-text {
position: absolute;
top: -19px;
color: white;
font-weight: bold;
}
</style>
<style lang="scss">
.customize-select-style {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment