|
|
@ -15,11 +15,11 @@ |
|
|
|
<div class="title font-size-18px font-bold mb-10px">项目物料检测类型次数清单</div> |
|
|
|
<el-table :data="tableData" style="width: 100%"> |
|
|
|
<el-table-column label="序号" width="80" type="index" align="center" /> |
|
|
|
<el-table-column prop="project" label="项目" align="center" /> |
|
|
|
<el-table-column prop="code" label="物料代码" align="center" /> |
|
|
|
<el-table-column prop="name" label="名称" align="center" /> |
|
|
|
<el-table-column prop="type" label="检查类型" align="center" /> |
|
|
|
<el-table-column prop="num" label="次数" align="center" /> |
|
|
|
<el-table-column prop="projectName" label="项目" align="center" /> |
|
|
|
<el-table-column prop="itemCode" label="物料代码" align="center" /> |
|
|
|
<el-table-column prop="itemName" label="物料名称" align="center" /> |
|
|
|
<el-table-column prop="itemTypeName" label="检查类型" align="center" /> |
|
|
|
<el-table-column prop="cishu" label="次数" align="center" /> |
|
|
|
</el-table> |
|
|
|
</el-card> |
|
|
|
</el-col> |
|
|
@ -28,11 +28,11 @@ |
|
|
|
<div class="title font-size-18px font-bold mb-10px">项目物料检测类型时间清单</div> |
|
|
|
<el-table :data="tableData1" style="width: 100%"> |
|
|
|
<el-table-column label="序号" width="80" type="index" align="center" /> |
|
|
|
<el-table-column prop="code" label="物料代码" align="center" /> |
|
|
|
<el-table-column prop="name" label="物料名称" align="center" /> |
|
|
|
<el-table-column prop="type" label="检测类型" align="center" /> |
|
|
|
<el-table-column prop="time" label="导入时间" align="center" /> |
|
|
|
<el-table-column prop="people" label="操作人" align="center" /> |
|
|
|
<el-table-column prop="itemCode" label="物料代码" align="center" /> |
|
|
|
<el-table-column prop="itemName" label="物料名称" align="center" /> |
|
|
|
<el-table-column prop="itemTypeName" label="检测类型" align="center" /> |
|
|
|
<el-table-column prop="times" label="导入时间" align="center" /> |
|
|
|
<el-table-column prop="createName" label="操作人" align="center" /> |
|
|
|
</el-table> |
|
|
|
</el-card> |
|
|
|
</el-col> |
|
|
@ -42,146 +42,103 @@ |
|
|
|
import { set } from 'lodash-es' |
|
|
|
import { EChartsOption } from 'echarts' |
|
|
|
import { lineOptions, barOptions } from './echarts-data' |
|
|
|
import * as rescordAPI from '@/api/home/shouye' |
|
|
|
|
|
|
|
defineOptions({ name: 'Home' }) |
|
|
|
const { t } = useI18n() |
|
|
|
const tableData = [ |
|
|
|
{ |
|
|
|
project: '项目1', |
|
|
|
code: 'jkhdkjgh', |
|
|
|
name: '名字1', |
|
|
|
type: '类型1', |
|
|
|
num: 30 |
|
|
|
}, |
|
|
|
{ |
|
|
|
project: '项目1', |
|
|
|
code: 'jkhdkjgh', |
|
|
|
name: '名字1', |
|
|
|
type: '类型1', |
|
|
|
num: 30 |
|
|
|
}, |
|
|
|
{ |
|
|
|
project: '项目1', |
|
|
|
code: 'jkhdkjgh', |
|
|
|
name: '名字1', |
|
|
|
type: '类型1', |
|
|
|
num: 30 |
|
|
|
}, |
|
|
|
{ |
|
|
|
project: '项目1', |
|
|
|
code: 'jkhdkjgh', |
|
|
|
name: '名字1', |
|
|
|
type: '类型1', |
|
|
|
num: 30 |
|
|
|
} |
|
|
|
] |
|
|
|
const tableData1 = [ |
|
|
|
{ |
|
|
|
code: 'jkhdkjgh', |
|
|
|
name: '名字1', |
|
|
|
type: '类型1', |
|
|
|
time: '2023-12-12 06:00:00', |
|
|
|
people:'小张' |
|
|
|
}, |
|
|
|
{ |
|
|
|
code: 'jkhdkjgh', |
|
|
|
name: '名字1', |
|
|
|
type: '类型1', |
|
|
|
time: '2023-12-12 06:00:00', |
|
|
|
people:'小张' |
|
|
|
}, |
|
|
|
{ |
|
|
|
code: 'jkhdkjgh', |
|
|
|
name: '名字1', |
|
|
|
type: '类型1', |
|
|
|
time: '2023-12-12 06:00:00', |
|
|
|
people:'小张' |
|
|
|
}, |
|
|
|
{ |
|
|
|
code: 'jkhdkjgh', |
|
|
|
name: '名字1', |
|
|
|
type: '类型1', |
|
|
|
time: '2023-12-12 06:00:00', |
|
|
|
people:'小张' |
|
|
|
} |
|
|
|
] |
|
|
|
const tableData = ref([]); |
|
|
|
const tableData1 = ref([]); |
|
|
|
const echartsData = ref(); |
|
|
|
const barOptionsData = reactive<EChartsOption>(barOptions) as EChartsOption |
|
|
|
const getWeeklyUserActivity = async () => { |
|
|
|
const data = [ |
|
|
|
{ value: 13253, name: 'analysis.monday' }, |
|
|
|
{ value: 34235, name: 'analysis.tuesday' }, |
|
|
|
{ value: 26321, name: 'analysis.wednesday' }, |
|
|
|
{ value: 12340, name: 'analysis.thursday' }, |
|
|
|
{ value: 24643, name: 'analysis.friday' }, |
|
|
|
{ value: 1322, name: 'analysis.saturday' }, |
|
|
|
{ value: 1324, name: 'analysis.sunday' } |
|
|
|
] |
|
|
|
const data1 = [ |
|
|
|
{ value: 23444, name: 'analysis.monday' }, |
|
|
|
{ value: 12344, name: 'analysis.tuesday' }, |
|
|
|
{ value: 34455, name: 'analysis.wednesday' }, |
|
|
|
{ value: 3434, name: 'analysis.thursday' }, |
|
|
|
{ value: 43333, name: 'analysis.friday' }, |
|
|
|
{ value: 45555, name: 'analysis.saturday' }, |
|
|
|
{ value: 1324, name: 'analysis.sunday' } |
|
|
|
] |
|
|
|
const data2 = [ |
|
|
|
{ value: 4344, name: 'analysis.monday' }, |
|
|
|
{ value: 34454, name: 'analysis.tuesday' }, |
|
|
|
{ value: 4322, name: 'analysis.wednesday' }, |
|
|
|
{ value: 9897, name: 'analysis.thursday' }, |
|
|
|
{ value: 89076, name: 'analysis.friday' }, |
|
|
|
{ value: 5434, name: 'analysis.saturday' }, |
|
|
|
{ value: 67674, name: 'analysis.sunday' } |
|
|
|
] |
|
|
|
const data3 = [ |
|
|
|
{ value: 4344, name: 'analysis.monday' }, |
|
|
|
{ value: 34454, name: 'analysis.tuesday' }, |
|
|
|
{ value: 4322, name: 'analysis.wednesday' }, |
|
|
|
{ value: 9897, name: 'analysis.thursday' }, |
|
|
|
{ value: 89076, name: 'analysis.friday' }, |
|
|
|
{ value: 5434, name: 'analysis.saturday' }, |
|
|
|
{ value: 67674, name: 'analysis.sunday' } |
|
|
|
] |
|
|
|
|
|
|
|
const xdata = echartsData.value.days.map(item=>item); |
|
|
|
const data = echartsData.value.CHROMATIC_ABERRATION; |
|
|
|
const data1 = echartsData.value.DIMENSION;//尺寸 |
|
|
|
const data2 = echartsData.value.GLOSS;//光泽桔皮 |
|
|
|
const data3 = echartsData.value.PROPERTY;//性能 |
|
|
|
// const data = [ |
|
|
|
// { value: 13253, name: 'analysis.monday' }, |
|
|
|
// { value: 34235, name: 'analysis.tuesday' }, |
|
|
|
// { value: 26321, name: 'analysis.wednesday' }, |
|
|
|
// { value: 12340, name: 'analysis.thursday' }, |
|
|
|
// { value: 24643, name: 'analysis.friday' }, |
|
|
|
// { value: 1322, name: 'analysis.saturday' }, |
|
|
|
// { value: 1324, name: 'analysis.sunday' } |
|
|
|
// ] |
|
|
|
// const data1 = [ |
|
|
|
// { value: 23444, name: 'analysis.monday' }, |
|
|
|
// { value: 12344, name: 'analysis.tuesday' }, |
|
|
|
// { value: 34455, name: 'analysis.wednesday' }, |
|
|
|
// { value: 3434, name: 'analysis.thursday' }, |
|
|
|
// { value: 43333, name: 'analysis.friday' }, |
|
|
|
// { value: 45555, name: 'analysis.saturday' }, |
|
|
|
// { value: 1324, name: 'analysis.sunday' } |
|
|
|
// ] |
|
|
|
// const data2 = [ |
|
|
|
// { value: 4344, name: 'analysis.monday' }, |
|
|
|
// { value: 34454, name: 'analysis.tuesday' }, |
|
|
|
// { value: 4322, name: 'analysis.wednesday' }, |
|
|
|
// { value: 9897, name: 'analysis.thursday' }, |
|
|
|
// { value: 89076, name: 'analysis.friday' }, |
|
|
|
// { value: 5434, name: 'analysis.saturday' }, |
|
|
|
// { value: 67674, name: 'analysis.sunday' } |
|
|
|
// ] |
|
|
|
// const data3 = [ |
|
|
|
// { value: 4344, name: 'analysis.monday' }, |
|
|
|
// { value: 34454, name: 'analysis.tuesday' }, |
|
|
|
// { value: 4322, name: 'analysis.wednesday' }, |
|
|
|
// { value: 9897, name: 'analysis.thursday' }, |
|
|
|
// { value: 89076, name: 'analysis.friday' }, |
|
|
|
// { value: 5434, name: 'analysis.saturday' }, |
|
|
|
// { value: 67674, name: 'analysis.sunday' } |
|
|
|
// ] |
|
|
|
set(barOptionsData, 'title', { |
|
|
|
text: '检测类型导入次数(近7天)', |
|
|
|
left: 0 |
|
|
|
left: 0, |
|
|
|
textStyle:{ |
|
|
|
fontSize:16, |
|
|
|
} |
|
|
|
|
|
|
|
}) |
|
|
|
set( |
|
|
|
barOptionsData, |
|
|
|
'xAxis.data', |
|
|
|
data.map((v) => t(v.name)) |
|
|
|
xdata |
|
|
|
) |
|
|
|
set(barOptionsData, 'legend', { |
|
|
|
data: [t('analysis.activeQuantity'), '11', '22', '23'], |
|
|
|
data: ['色差', '尺寸', '光泽桔皮', '性能'], |
|
|
|
top: 0, |
|
|
|
right: 20 |
|
|
|
}) |
|
|
|
set(barOptionsData, 'series', [ |
|
|
|
{ |
|
|
|
name: t('analysis.activeQuantity'), |
|
|
|
data: data.map((v) => v.value), |
|
|
|
name: '色差', |
|
|
|
data: data, |
|
|
|
// data: data.map((v) => v.value), |
|
|
|
type: 'bar', |
|
|
|
animationDuration: 2000, |
|
|
|
animationEasing: 'cubicInOut' |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '11', |
|
|
|
data: data1.map((v) => v.value), |
|
|
|
name: '尺寸', |
|
|
|
data: data1, |
|
|
|
type: 'bar', |
|
|
|
animationDuration: 2000, |
|
|
|
animationEasing: 'cubicInOut' |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '22', |
|
|
|
data: data2.map((v) => v.value), |
|
|
|
name: '光泽桔皮', |
|
|
|
data: data2, |
|
|
|
type: 'bar', |
|
|
|
animationDuration: 2000, |
|
|
|
animationEasing: 'cubicInOut' |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '23', |
|
|
|
data: data3.map((v) => v.value), |
|
|
|
name: '性能', |
|
|
|
data: data3.forEach(element => { |
|
|
|
element |
|
|
|
}), |
|
|
|
type: 'bar', |
|
|
|
animationDuration: 2000, |
|
|
|
animationEasing: 'cubicInOut' |
|
|
@ -191,75 +148,57 @@ const getWeeklyUserActivity = async () => { |
|
|
|
|
|
|
|
const lineOptionsData = reactive<EChartsOption>(lineOptions) as EChartsOption |
|
|
|
const getWeeklyUserActivity1 = async () => { |
|
|
|
const data = [ |
|
|
|
{ value: 13253, name: 'analysis.monday' }, |
|
|
|
{ value: 34235, name: 'analysis.tuesday' }, |
|
|
|
{ value: 26321, name: 'analysis.wednesday' }, |
|
|
|
{ value: 12340, name: 'analysis.thursday' }, |
|
|
|
{ value: 24643, name: 'analysis.friday' }, |
|
|
|
{ value: 1322, name: 'analysis.saturday' }, |
|
|
|
{ value: 1324, name: 'analysis.sunday' } |
|
|
|
] |
|
|
|
const data1 = [ |
|
|
|
{ value: 23444, name: 'analysis.monday' }, |
|
|
|
{ value: 12344, name: 'analysis.tuesday' }, |
|
|
|
{ value: 34455, name: 'analysis.wednesday' }, |
|
|
|
{ value: 3434, name: 'analysis.thursday' }, |
|
|
|
{ value: 43333, name: 'analysis.friday' }, |
|
|
|
{ value: 45555, name: 'analysis.saturday' }, |
|
|
|
{ value: 1324, name: 'analysis.sunday' } |
|
|
|
] |
|
|
|
const data2 = [ |
|
|
|
{ value: 4344, name: 'analysis.monday' }, |
|
|
|
{ value: 34454, name: 'analysis.tuesday' }, |
|
|
|
{ value: 4322, name: 'analysis.wednesday' }, |
|
|
|
{ value: 9897, name: 'analysis.thursday' }, |
|
|
|
{ value: 89076, name: 'analysis.friday' }, |
|
|
|
{ value: 5434, name: 'analysis.saturday' }, |
|
|
|
{ value: 67674, name: 'analysis.sunday' } |
|
|
|
] |
|
|
|
|
|
|
|
const xdata = echartsData.value.days; |
|
|
|
const data = echartsData.value.CHROMATIC_ABERRATION;//色差 |
|
|
|
const data1 = echartsData.value.DIMENSION;//尺寸 |
|
|
|
const data2 = echartsData.value.GLOSS;//光泽桔皮 |
|
|
|
const data3 = echartsData.value.PROPERTY;//性能 |
|
|
|
set(lineOptionsData, 'title', { |
|
|
|
text: '检测类型导入次数(近7天)', |
|
|
|
left: 0 |
|
|
|
left: 0, |
|
|
|
textStyle:{ |
|
|
|
fontSize:16, |
|
|
|
} |
|
|
|
}) |
|
|
|
set( |
|
|
|
lineOptionsData, |
|
|
|
'xAxis.data', |
|
|
|
data.map((v) => t(v.name)) |
|
|
|
xdata |
|
|
|
) |
|
|
|
set(lineOptionsData, 'legend', { |
|
|
|
data: [t('analysis.activeQuantity'), '11', '22', '23'], |
|
|
|
data: ['色差', '尺寸', '光泽桔皮', '性能'], |
|
|
|
top: 0, |
|
|
|
right: 20 |
|
|
|
}) |
|
|
|
set(lineOptionsData, 'series', [ |
|
|
|
{ |
|
|
|
name: t('analysis.activeQuantity'), |
|
|
|
data: data.map((v) => v.value), |
|
|
|
name: '色差', |
|
|
|
data:data, |
|
|
|
smooth: true, |
|
|
|
type: 'line', |
|
|
|
animationDuration: 2000, |
|
|
|
animationEasing: 'cubicInOut' |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '11', |
|
|
|
data: data1.map((v) => v.value), |
|
|
|
name: '尺寸', |
|
|
|
data:data1, |
|
|
|
smooth: true, |
|
|
|
type: 'line', |
|
|
|
animationDuration: 2000, |
|
|
|
animationEasing: 'cubicInOut' |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '22', |
|
|
|
data: data2.map((v) => v.value), |
|
|
|
name: '光泽桔皮', |
|
|
|
data:data2, |
|
|
|
smooth: true, |
|
|
|
type: 'line', |
|
|
|
animationDuration: 2000, |
|
|
|
animationEasing: 'cubicInOut' |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '23', |
|
|
|
data: data1.map((v) => v.value), |
|
|
|
name: '性能', |
|
|
|
data:data3, |
|
|
|
smooth: true, |
|
|
|
type: 'line', |
|
|
|
animationDuration: 2000, |
|
|
@ -267,9 +206,12 @@ const getWeeklyUserActivity1 = async () => { |
|
|
|
} |
|
|
|
]) |
|
|
|
} |
|
|
|
onMounted(() => { |
|
|
|
getWeeklyUserActivity() |
|
|
|
getWeeklyUserActivity1() |
|
|
|
onMounted(async() => {//初始化方法 |
|
|
|
tableData.value = await rescordAPI.getSYFrequency(); |
|
|
|
tableData1.value = await rescordAPI.getSYTime(); |
|
|
|
echartsData.value = await rescordAPI.getSYEchartsData(); |
|
|
|
await getWeeklyUserActivity() |
|
|
|
await getWeeklyUserActivity1() |
|
|
|
}) |
|
|
|
</script> |
|
|
|
<style lang="scss" scoped> |
|
|
|