未按期齐套任务
-
-
+
| {{ column.label }} | +{{ column.label }} |
|---|---|
| {{ row[column.key] }} | +|
| + + {{ row[column.key] }} + |
加急件明细
+ 未按期齐套任务
-
+
@@ -150,8 +153,8 @@ const tableData = ref([])
const now = ref(new Date('2026-05-06 10:10:10'))
let timer = null
let resizeHandler = null
-let Urgentnum = null
-let notintimenum = null
+const Urgentnum = ref(0)
+const notintimenum = ref(0)
let complete = reactive({
completeset:100,
tasknum:0,
@@ -200,8 +203,13 @@ onMounted(() => {
resizeHandler = () => {
setScale()
}
+
window.addEventListener('resize', resizeHandler)
searchDashboardData()
+ // setInterval(function(){
+ // searchDashboardData()
+ // },600000)
+
})
onUnmounted(() => {
@@ -223,7 +231,7 @@ const searchNoProcessData = () => {
queryDashboardData('生产任务综合看板_未排产无工艺查询', applyNoProcessData)
}
const searchUrgentData = () => {
- queryDashboardData('生产任务综合看板_加急任务查询', applyUrgentData)
+ queryDashboardData('机加设备生产运营看板_加急任务查询', applyUrgentData)
}
const searchNotInTimeData = () => {
queryDashboardData('生产任务综合看板_未及时开工查询', applyNotInTimeData)
@@ -232,50 +240,43 @@ const searchUnCompleteData = () => {
queryDashboardData('生产任务综合看板_未按期齐套任务', applyUnCompleteData)
}
const applyCompleteSetData = rows => {
- complete.completeset = rows[0].齐套率
- complete.untasknum = rows[0].未齐套任务数
- complete.tasknum = rows[0].总任务数
+ const first = getFirstRow(rows)
+ complete.completeset = first.齐套率 || 0
+ complete.untasknum = first.未齐套任务数 || 0
+ complete.tasknum = first.总任务数 || 0
}
const applyNoProcessData = rows => {
- const total = rows[0].未排产任务数
- const assembly = rows[0].装配未排产数
+ const first = getFirstRow(rows)
+ const total = first.未排产任务数 || 0
+ const assembly = first.装配未排产数 || 0
noProcessStats.total = total
noProcessStats.machining = total - assembly
noProcessStats.assembly = assembly
- topStats[1].value = rows[0].无生产工艺计划数
+ topStats[1].value = first.无生产工艺计划数 || 0
}
const applyNotInTimeData = rows => {
- notintimenum = rows[0].未及时开工总数
+ notintimenum.value = getFirstRow(rows).未及时开工总数 || 0
}
const applyUrgentData = rows => {
- urgentRows = rows.map( item => ({
- salesOrder: item.合同号,
- productionOrder: item.订单编号,
- productName: item.物料描述,
- productCode: item.物料编号,
- property: item.自制件属性,
- planQty: item.计划数量,
- releaseDate: item.下达日期,
- startDate: item.计划开始,
- finishDate: item.计划完成,
- }))
- Urgentnum = rows[0].加急订单总数
+ const first = getFirstRow(rows)
+ if (first.加急订单总数 !== undefined) {
+ Urgentnum.value = first.加急订单总数
+ }
+
+ urgentRows.value = rows.map(item => ({
+ productionOrder: `${item.订单编号 || ''}-${item.合同号 || ''}`,
+ materialName: item.物料描述,
+ materialCode: item.物料编号,
+ urgentQty: item.加急数量,
+ progress: decodeHtml(item.工序进度详情 || ''),
+ }))
}
const applyUnCompleteData = rows => {
- kitRows = rows.map( item => ({
+ kitRows.value = rows.map( item => ({
productionOrder: item.订单编号,
productName: item.物料描述,
productCode: item.物料编号,
- property: item.自制件属性,
- planQty: item.计划数量,
- releaseDate: item.下达日期,
- startDate: item.计划开始时间,
- finishDate: item.计划完成时间,
planNo: item.合同号,
- stockQty: '0',
- kitDate: item.计划开始时间,
- pickStatus: item.拣配状态 == 1 ?'已拣配':'未拣配',
- issueStatus: item.发料状态 == 2 ?'发料缺件':'未发料',
}))
}
const queryDashboardData = (procedureName, applyData) => {
@@ -297,6 +298,240 @@ const getResponseRows = response => {
return []
}
+const getFirstRow = rows => {
+ if (Array.isArray(rows) && rows.length > 0) {
+ return rows[0]
+ }
+ return {}
+}
+
+const escapeHtml = value => String(value == null ? '' : value)
+ .replace(/&/g, '&')
+ .replace(//g, '>')
+ .replace(/"/g, '"')
+ .replace(/'/g, ''')
+
+const decodeHtml = value => {
+ if (!value || typeof value !== 'string') {
+ return ''
+ }
+ if (typeof document === 'undefined') {
+ return value
+ .replace(/>/g, '>')
+ .replace(/</g, '<')
+ .replace(/&/g, '&')
+ .replace(/"/g, '"')
+ .replace(/'/g, "'")
+ }
+ const textarea = document.createElement('textarea')
+ textarea.innerHTML = value
+ return textarea.value
+}
+
+const blueProcessStyle = 'color: #09a8ff; font-weight: 700;'
+const greenProcessStyle = 'color: #28d961; font-weight: 700;'
+const redProcessStyle = 'color: #ff3f37; font-weight: 700;'
+
+const toNumber = value => {
+ const num = Number(value)
+ return Number.isFinite(num) ? num : 0
+}
+
+const parseProcessStep = step => {
+ const parts = step.split('|')
+ const hasLineNo = parts[4] !== undefined && parts[4] !== '' && !Number.isNaN(Number(parts[4]))
+
+ return {
+ name: parts[0] || '',
+ status: parts[1] || '0',
+ count: parts[2] || '0',
+ planDate: parts[3] || '',
+ assignee: hasLineNo ? '' : (parts[4] || ''),
+ outsourceGroup: hasLineNo ? (parts[5] || '') : (parts[5] || ''),
+ lineNo: hasLineNo ? toNumber(parts[4]) : null,
+ issueQty: hasLineNo ? toNumber(parts[6]) : 0,
+ badQty: hasLineNo ? toNumber(parts[7]) : 0
+ }
+}
+
+const isBlueProcess = (status, count) => {
+ const statusNum = parseInt(status)
+ const countNum = parseInt(count)
+ return statusNum === 6 || statusNum === 3 || countNum > 0
+}
+
+const isOutsourceProcess = process => (
+ process.assignee === '外协' ||
+ process.name.includes('(外协)') ||
+ process.name.includes('（外协）')
+)
+
+const isGreenProcess = process => (
+ isOutsourceProcess(process) &&
+ process.issueQty > toNumber(process.count) + toNumber(process.badQty)
+)
+
+const getProcessBaseStyle = process => {
+ if (isGreenProcess(process)) {
+ return greenProcessStyle
+ }
+ if (isBlueProcess(process.status, process.count)) {
+ return blueProcessStyle
+ }
+
+ const statusNum = parseInt(process.status)
+ if (statusNum === 2 || statusNum === 4) {
+ return greenProcessStyle
+ }
+
+ return redProcessStyle
+}
+
+const getOutsourceGroupStyleState = steps => {
+ const styles = new Map()
+ const processes = steps.map(parseProcessStep)
+
+ let currentIndexes = []
+ let lastProcess = null
+ const flushOutsourceRun = () => {
+ if (currentIndexes.length > 0 && lastProcess) {
+ const style = getProcessBaseStyle(lastProcess)
+ currentIndexes.forEach(index => styles.set(index, style))
+ }
+ currentIndexes = []
+ lastProcess = null
+ }
+
+ const isSameContinuousGroup = process => {
+ if (!lastProcess) {
+ return true
+ }
+ if (process.lineNo === null || lastProcess.lineNo === null) {
+ return false
+ }
+ return process.lineNo === lastProcess.lineNo + 1 &&
+ (process.outsourceGroup || '') === (lastProcess.outsourceGroup || '')
+ }
+
+ processes.forEach((process, index) => {
+ if (!isOutsourceProcess(process)) {
+ flushOutsourceRun()
+ return
+ }
+ if (!isSameContinuousGroup(process)) {
+ flushOutsourceRun()
+ }
+ currentIndexes.push(index)
+ lastProcess = process
+ })
+ flushOutsourceRun()
+
+ return { styles }
+}
+
+const getOutsourceGroupStyle = (process, index, outsourceGroupStyleState) => {
+ if (!isOutsourceProcess(process)) {
+ return ''
+ }
+ return outsourceGroupStyleState.styles.get(index) || ''
+}
+
+const getProcessColor = (status, count, process = null, groupStyle = '') => {
+ if (groupStyle) {
+ return groupStyle
+ }
+ if (process) {
+ return getProcessBaseStyle(process)
+ }
+
+ const statusNum = parseInt(status)
+ const countNum = parseInt(count)
+ if (statusNum === 2 || statusNum === 4) {
+ return greenProcessStyle
+ }
+ if (statusNum === 6 || statusNum === 3) {
+ return blueProcessStyle
+ }
+ if (countNum > 0) {
+ return blueProcessStyle
+ }
+ return redProcessStyle
+}
+
+const formatProcessDetail = processDetailStr => {
+ if (!processDetailStr || typeof processDetailStr !== 'string') {
+ return ''
+ }
+
+ const steps = processDetailStr.split(' -> ')
+ const outsourceGroupStyleState = getOutsourceGroupStyleState(steps)
+ const maxPerRow = 8
+ const rows = Math.ceil(steps.length / maxPerRow)
+ let tableHtml = ''
+ return tableHtml
+}
+
const startClock = () => {
timer = window.setInterval(() => {
now.value = new Date(now.value.getTime() + 1000)
@@ -314,60 +549,55 @@ const destroyDashboard = () => {
}
}
-const topStats = [
+const topStats = reactive([
{ title: '待处理销售订单', value: 12, icon: svgIcons.salesOrder },
{ title: '工艺BOM待完成', value: 9, icon: svgIcons.bom },
-]
+])
const leftColumns = [
- { label: '销售订单', key: 'salesOrder' },
- { label: '计划号', key: 'planNo' },
+ { label: '销售订单', key: 'planNo' },
{ label: '生产订单', key: 'productionOrder' },
{ label: '产品名称', key: 'productName' },
- { label: '产品编码', key: 'productCode' },
- { label: '计划数', key: 'planQty' },
- { label: '入库数', key: 'stockQty' },
- { label: '预计齐套', key: 'kitDate' },
- { label: '拣配状态', key: 'pickStatus' },
- { label: '发料状态', key: 'issueStatus' },
+ { label: '产品编码', key: 'productCode' }
]
const urgentColumns = [
- { label: '销售订单', key: 'salesOrder' },
{ label: '生产订单', key: 'productionOrder' },
- { label: '产品名称', key: 'productName' },
- { label: '产品编码', key: 'productCode' },
- { label: '属性', key: 'property' },
- { label: '计划数', key: 'planQty' },
- { label: '下达日期', key: 'releaseDate' },
- { label: '计划开始', key: 'startDate' },
- { label: '计划完成', key: 'finishDate' },
+ { label: '物料名称', key: 'materialName' },
+ { label: '物料编码', key: 'materialCode' },
+ { label: '加急数量', key: 'urgentQty' },
+ { label: '进度', key: 'progress' }
]
-let kitRows = Array.from({ length: 9 }, () => ({
- salesOrder: 'SH260014',
+const makeScrollRows = (rows, minRows = 10) => {
+ if (!Array.isArray(rows) || rows.length === 0) {
+ return []
+ }
+
+ const baseRows = [...rows]
+ while (baseRows.length < minRows) {
+ baseRows.push(...rows.slice(0, minRows - baseRows.length))
+ }
+ return [...baseRows, ...baseRows]
+}
+
+const kitRows = ref(Array.from({ length: 9 }, () => ({
planNo: '54023',
productionOrder: '1075',
productName: '垫铁+行程开关部装',
- productCode: '213-YGLQ-DF150V1.2.18',
- planQty: '1',
- stockQty: '0',
- kitDate: '2026-01-21',
- pickStatus: '已拣配',
- issueStatus: '未发料',
-}))
+ productCode: '213-YGLQ-DF150V1.2.18'
+})))
-let urgentRows = Array.from({ length: 10 }, () => ({
- salesOrder: 'SH260014',
- productionOrder: '1075',
- productName: '垫铁+行程开关部装',
- productCode: '213-YGLQ-DF150V1.2.18',
- property: '机加',
- planQty: '1',
- releaseDate: '2026-01-21',
- startDate: '2026-01-21',
- finishDate: '2026-01-21',
-}))
+const urgentRows = ref([])
+
+const displayUrgentRows = computed(() => makeScrollRows(urgentRows.value, 8))
+const displayKitRows = computed(() => makeScrollRows(kitRows.value, 9))
+const getScrollDuration = (rows, minRows, secondsPerRow) => {
+ const rowCount = Math.max(Array.isArray(rows) ? rows.length : 0, minRows)
+ return `${Math.max(rowCount * secondsPerRow, 36)}s`
+}
+const urgentScrollDuration = computed(() => getScrollDuration(urgentRows.value, 8, 4.2))
+const kitScrollDuration = computed(() => getScrollDuration(kitRows.value, 9, 3.5))
| {{ column.label }} | +{{ column.label }} |
|---|---|
| {{ row[column.key] }} | +|
| {{ row[column.key] }} |