mt-fe-group/tft-fe
8
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

zjl #3

Merged
juzi merged 2 commits from zjl into master 2023-02-13 17:25:35 +08:00
Conversation 0 Commits 2 Files Changed 12 +379 -139
12 changed files with 379 additions and 139 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.env.development
View File

@ -5,4 +5,4 @@ ENV = 'development'
# 这里修改成api服务器地址 # 这里修改成api服务器地址
VUE_APP_BASE_API = '/api' VUE_APP_BASE_API = '/api'
VUE_APP_VIEW_PIC = 'http://tft.mes.picaiba.com/api/common/attachment/downloadFile?type=0&attachmentId=' VUE_APP_VIEW_PIC = 'http://tft.mes.picaiba.com/api/common/attachment/downloadFile?type=0&attachmentId='
VUE_APP_REPORT_DESIGN_URL = 'http://hfxny.mes.picaiba.com/ureport/designer' VUE_APP_REPORT_DESIGN_URL = 'http://tft.mes.picaiba.com/ureport/designer'

2
.env.production
View File

@ -5,4 +5,4 @@ ENV = 'production'
# 这里修改成api服务器地址 # 这里修改成api服务器地址
VUE_APP_BASE_API = '/api' VUE_APP_BASE_API = '/api'
VUE_APP_VIEW_PIC = 'http://tft.mes.picaiba.com/api/common/attachment/downloadFile?type=0&attachmentId=' VUE_APP_VIEW_PIC = 'http://tft.mes.picaiba.com/api/common/attachment/downloadFile?type=0&attachmentId='
VUE_APP_REPORT_DESIGN_URL = 'http://hfxny.mes.picaiba.com/ureport/designer' VUE_APP_REPORT_DESIGN_URL = 'http://tft.mes.picaiba.com/ureport/designer'

11
src/api/deviceManagement.js
View File

@ -16,6 +16,13 @@ export function performanceAnalysisPlan(data) {
data data
}) })
} }
export function performanceUpdatePlan(data) {
return request({
url: '/equipment/PerformanceAnalysis/updatePlan',
method: 'post',
data
})
}
// 托盘指标分析 // 托盘指标分析
export function palletIndicatorAnalysisPage(data) { export function palletIndicatorAnalysisPage(data) {
return request({ return request({
@ -24,9 +31,7 @@ export function palletIndicatorAnalysisPage(data) {
data data
}) })
} }
export function palletIndicatorGetType(data) {
// 托盘指标分析
export function palletIndicatorAnalysisType(data) {
return request({ return request({
url: '/equipment/PalletIndicatorAnalysis/getType', url: '/equipment/PalletIndicatorAnalysis/getType',
method: 'post', method: 'post',

2
src/views/basicConfig/components/accountAdd.vue
View File

@ -3,7 +3,6 @@
<el-form-item label="用户名" prop="account"> <el-form-item label="用户名" prop="account">
<el-input <el-input
v-model="form.account" v-model="form.account"
onkeyup="value=value.replace(/[\W]/g,'')"
placeholder="只能输入字母或数字，不可输入汉字" placeholder="只能输入字母或数字，不可输入汉字"
:disabled="isEdit" :disabled="isEdit"
></el-input> ></el-input>
@ -109,6 +108,7 @@ export default {
submitForm() { submitForm() {
this.$refs['form'].validate((valid) => { this.$refs['form'].validate((valid) => {
if (valid) { if (valid) {
this.form.account = this.form.account.replace(/[\W]/g, '')
if (this.isEdit) { if (this.isEdit) {
//编辑 //编辑
accountUpdate({ ...this.form }).then((res) => { accountUpdate({ ...this.form }).then((res) => {

5
src/views/basicConfig/reportManagement/reportDesign.vue
View File

@ -8,10 +8,7 @@ export default {
name: 'ReportDesign', name: 'ReportDesign',
data() { data() {
return { return {
// url: '' url: process.env.VUE_APP_REPORT_DESIGN_URL
// url: process.env.VUE_APP_REPORT_DESIGN_URL
// url: 'http://hfxny.mes.picaiba.com/ureport/designer'
url: 'http://tft.mes.picaiba.com/ureport/designer'
} }
}, },
mounted() { mounted() {

7
src/views/consumablesManagement/inAndOutManagement.vue
View File

@ -12,6 +12,7 @@
:table-props="tableProps" :table-props="tableProps"
:table-data="tableData" :table-data="tableData"
:max-height="tableH" :max-height="tableH"
:row-class-name="tableRowClassName"
> >
<method-btn <method-btn
v-if="tableBtn.length" v-if="tableBtn.length"
@ -297,6 +298,12 @@ export default {
}) })
} }
}, },
tableRowClassName({ row }) {
if (row.flag && row.flag > 0) {
return 'danger-row'
}
return ''
},
handleCancel() { handleCancel() {
this.$refs.inAndOutManagementAdd.formClear() this.$refs.inAndOutManagementAdd.formClear()
this.addAndEdit = '' this.addAndEdit = ''

58
src/views/deviceManagement/components/deviceOeeLine.vue
View File

@ -14,6 +14,15 @@ import resize from '@/utils/chartMixins/resize'
export default { export default {
name: 'deviceOeeLine', name: 'deviceOeeLine',
mixins: [resize], mixins: [resize],
props: {
chartMsg: {
type: Array,
required: true,
default: () => {
return []
}
}
},
data() { data() {
return { return {
chartDom: '', chartDom: '',
@ -22,15 +31,48 @@ export default {
} }
}, },
mounted() { mounted() {
this.chartDom = document.getElementById('main') this.$nextTick(() => {
this.chart = echarts.init(this.chartDom) this.getChart()
this.getChart() })
window.addEventListener('resize', () => { window.addEventListener('resize', () => {
this.chartHeight = tableHeight(214) / 2 - 35 this.chartHeight = tableHeight(214) / 2 - 35
}) })
}, },
watch: {
chartMsg: function () {
this.getChart()
}
},
beforeDestroy() {
if (!this.chart) {
return
}
this.chart.dispose()
this.chart = null
},
methods: { methods: {
getChart() { getChart() {
if (
this.chart !== null &&
this.chart !== '' &&
this.chart !== undefined
) {
this.chart.dispose() // 页面多次刷新会出现警告，Dom已经初始化了一个实例，这是销毁实例
}
this.chartDom = document.getElementById('main')
this.chart = echarts.init(this.chartDom)
let dateList = []
let activationList = []
let performanceList = []
let failurePercentList = []
let combinedEfficiencyList = []
for (let i = 0; i < this.chartMsg.length; i++) {
dateList.push(new Date(this.chartMsg[i].date).getDate())
activationList.push(this.chartMsg[i].activation)
performanceList.push(this.chartMsg[i].performance)
failurePercentList.push(this.chartMsg[i].failurePercent)
combinedEfficiencyList.push(this.chartMsg[i].combinedEfficiency)
}
var option = { var option = {
color: ['#5B8FF9', '#5AD8A6', '#5D7092', '#F6BD16'], color: ['#5B8FF9', '#5AD8A6', '#5D7092', '#F6BD16'],
tooltip: { tooltip: {
@ -49,7 +91,7 @@ export default {
xAxis: { xAxis: {
type: 'category', type: 'category',
boundaryGap: false, boundaryGap: false,
data: ['1', '2', '3', '4', '5', '6', '7'] data: dateList
}, },
yAxis: { yAxis: {
type: 'value' type: 'value'
@ -59,25 +101,25 @@ export default {
name: '时间开动率', name: '时间开动率',
type: 'line', type: 'line',
stack: 'Total', stack: 'Total',
data: [120, 132, 101, 134, 90, 230, 210] data: activationList
}, },
{ {
name: '性能开动率', name: '性能开动率',
type: 'line', type: 'line',
stack: 'Total', stack: 'Total',
data: [220, 182, 191, 234, 290, 330, 310] data: performanceList
}, },
{ {
name: '设备故障率', name: '设备故障率',
type: 'line', type: 'line',
stack: 'Total', stack: 'Total',
data: [150, 232, 201, 154, 190, 330, 410] data: failurePercentList
}, },
{ {
name: '综合效率', name: '综合效率',
type: 'line', type: 'line',
stack: 'Total', stack: 'Total',
data: [320, 332, 301, 334, 390, 330, 320] data: combinedEfficiencyList
} }
] ]
} }

148
src/views/deviceManagement/components/productPowerEdit.vue
View File

@ -1,98 +1,168 @@
<template> <template>
<el-form ref="form" :rules="rules" label-width="110px" :model="form"> <el-form ref="form" label-width="110px" :model="form">
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="1月" prop="a"> <el-form-item label="1月" prop="january">
<el-input v-model="form.a" placeholder="请输入计划产能"></el-input> <el-input-number
v-model="form.january"
:min="0"
style="width: 300px"
></el-input-number>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="2月" prop="b"> <el-form-item label="2月" prop="february">
<el-input v-model="form.b" placeholder="请输入计划产能"></el-input> <el-input-number
v-model="form.february"
:min="0"
style="width: 300px"
></el-input-number>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="3月" prop="c"> <el-form-item label="3月" prop="march">
<el-input v-model="form.c" placeholder="请输入计划产能"></el-input> <el-input-number
v-model="form.march"
:min="0"
style="width: 300px"
></el-input-number>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="4月" prop="d"> <el-form-item label="4月" prop="april">
<el-input v-model="form.d" placeholder="请输入计划产能"></el-input> <el-input-number
v-model="form.april"
:min="0"
style="width: 300px"
></el-input-number>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="5月" prop="e"> <el-form-item label="5月" prop="may">
<el-input v-model="form.e" placeholder="请输入计划产能"></el-input> <el-input-number
v-model="form.may"
:min="0"
style="width: 300px"
></el-input-number>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="6月" prop="f"> <el-form-item label="6月" prop="june">
<el-input v-model="form.f" placeholder="请输入计划产能"></el-input> <el-input-number
v-model="form.june"
:min="0"
style="width: 300px"
></el-input-number>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="7月" prop="g"> <el-form-item label="7月" prop="july">
<el-input v-model="form.g" placeholder="请输入计划产能"></el-input> <el-input-number
v-model="form.july"
:min="0"
style="width: 300px"
></el-input-number>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="8月" prop="h"> <el-form-item label="8月" prop="august">
<el-input v-model="form.h" placeholder="请输入计划产能"></el-input> <el-input-number
v-model="form.august"
:min="0"
style="width: 300px"
></el-input-number>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="9月" prop="i"> <el-form-item label="9月" prop="september">
<el-input v-model="form.i" placeholder="请输入计划产能"></el-input> <el-input-number
v-model="form.september"
:min="0"
style="width: 300px"
></el-input-number>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="10月" prop="j"> <el-form-item label="10月" prop="october">
<el-input v-model="form.j" placeholder="请输入计划产能"></el-input> <el-input-number
v-model="form.october"
:min="0"
style="width: 300px"
></el-input-number>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="11月" prop="k"> <el-form-item label="11月" prop="november">
<el-input v-model="form.k" placeholder="请输入计划产能"></el-input> <el-input-number
v-model="form.november"
:min="0"
style="width: 300px"
></el-input-number>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="12月" prop="l"> <el-form-item label="12月" prop="december">
<el-input v-model="form.l" placeholder="请输入计划产能"></el-input> <el-input-number
v-model="form.december"
:min="0"
style="width: 300px"
></el-input-number>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
</el-form> </el-form>
</template> </template>
<script> <script>
import {
performanceAnalysisPlan,
performanceUpdatePlan
} from '@/api/deviceManagement'
export default { export default {
name: 'productPowerEdit', name: 'productPowerEdit',
data() { data() {
return { return {
form: { form: {}
a: '', }
b: '', },
c: '', mounted() {},
d: '', methods: {
e: '', init(param) {
f: '', let date = new Date(param.timePosition)
g: '', let year = date.getFullYear()
h: '', performanceAnalysisPlan({
i: '', name: param.name,
j: '', year: year
k: '', }).then((res) => {
l: '' console.log(res)
} if (res.code === 0 && !!res.data) {
this.form = res.data
}
})
},
submitForm() {
performanceUpdatePlan({ ...this.form }).then((res) => {
if (res.code === 0) {
this.$message({
message: '操作成功',
type: 'success',
duration: 1500
})
this.$emit('successSubmit')
}
})
},
formClear() {
this.$refs.form.resetFields()
} }
} }
} }

7
src/views/deviceManagement/performanceAnalysis/analysisOfPallet.vue
View File

@ -55,7 +55,7 @@ import { tableHeight } from '@/utils/index'
import palletLevelChart from './../components/palletLevelChart.vue' import palletLevelChart from './../components/palletLevelChart.vue'
import { import {
palletIndicatorAnalysisPage, palletIndicatorAnalysisPage,
palletIndicatorAnalysisType palletIndicatorGetType
} from '@/api/deviceManagement' } from '@/api/deviceManagement'
import { timeFormatter } from '@/utils' import { timeFormatter } from '@/utils'
const tableProps = [ const tableProps = [
@ -159,7 +159,8 @@ export default {
], ],
listQuery: { listQuery: {
current: 1, current: 1,
size: 20 size: 20,
palletId: ''
}, },
total: 0, total: 0,
tableProps, tableProps,
@ -200,7 +201,7 @@ export default {
}, },
getLevel() { getLevel() {
// 需要修改ID // 需要修改ID
palletIndicatorAnalysisType({ id: 1 }).then((res) => { palletIndicatorGetType({ id: 1 }).then((res) => {
this.tableData2 = [] this.tableData2 = []
if (res.code === 0) { if (res.code === 0) {
const data = res.data const data = res.data

144
src/views/deviceManagement/performanceAnalysis/devicePage.vue
View File

@ -5,10 +5,12 @@
<div class="left-box"> <div class="left-box">
<el-tree <el-tree
:data="treeData" :data="treeData"
node-key="id" node-key="name"
:props="defaultTime" :props="defaultTime"
default-expand-all default-expand-all
:highlight-current="true"
@node-click="clickDevice" @node-click="clickDevice"
ref="deviceTree"
> >
</el-tree> </el-tree>
</div> </div>
@ -38,7 +40,7 @@
<el-col :span="6"> <el-col :span="6">
<div class="top-right"> <div class="top-right">
<div> <div>
<span class="title">xx单元计划产能</span> <span class="title">{{ unitName }}单元计划产能</span>
<svg-icon <svg-icon
icon-class="device_edit" icon-class="device_edit"
class="icon-style" class="icon-style"
@ -69,7 +71,7 @@
<el-row :gutter="10"> <el-row :gutter="10">
<el-col :span="24"> <el-col :span="24">
<div class="right-bottom"> <div class="right-bottom">
<device-oee-line /> <device-oee-line ref="oeeLine" :chartMsg="tableData" />
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
@ -83,13 +85,13 @@
@confirm="handleConfirm" @confirm="handleConfirm"
:before-close="handleCancel" :before-close="handleCancel"
> >
<product-power-edit ref="product-power" @successSubmit="successSubmit" /> <product-power-edit ref="productPower" @successSubmit="successSubmit" />
</base-dialog> </base-dialog>
</div> </div>
</template> </template>
<script> <script>
import { getTreeData } from '@/api/app' import { getTreeData } from '@/api/app'
import { tableHeight } from '@/utils/index' import { tableHeight, timeFormatter } from '@/utils/index'
import { import {
performanceAnalysisGet, performanceAnalysisGet,
performanceAnalysisPlan performanceAnalysisPlan
@ -98,64 +100,65 @@ import productPowerEdit from './../components/productPowerEdit.vue'
import deviceOeeLine from './../components/deviceOeeLine.vue' import deviceOeeLine from './../components/deviceOeeLine.vue'
const tableProps = [ const tableProps = [
{ {
prop: 'startTime', prop: 'date',
label: '时间', label: '时间',
minWidth: 90 minWidth: 160,
filter: timeFormatter
}, },
{ {
prop: 'endTime', prop: 'operationHours',
label: '开动时长(h)', label: '开动时长(h)',
minWidth: 100 minWidth: 100
}, },
{ {
prop: 'inputNum', prop: 'loadHours',
label: '负荷时长(h)', label: '负荷时长(h)',
minWidth: 100 minWidth: 100
}, },
{ {
prop: 'outputNum7', prop: 'actualCapacity',
label: '实际产能', label: '实际产能',
minWidth: 90 minWidth: 90
}, },
{ {
prop: 'lossesNum6', prop: 'planCountDay',
label: '设计产能', label: '设计产能',
minWidth: 90 minWidth: 90
}, },
{ {
prop: 'lossesNum5', prop: 'activation',
label: '时间开动率', label: '时间开动率',
minWidth: 100 minWidth: 100
}, },
{ {
prop: 'lossesNum4', prop: 'performance',
label: '性能开动率', label: '性能开动率',
minWidth: 100 minWidth: 100
}, },
{ {
prop: 'lossesNum3', prop: 'combinedEfficiency',
label: '综合效率OEE', label: '综合效率OEE',
minWidth: 110 minWidth: 110
}, },
{ {
prop: 'lossesNum2', prop: 'failureHours',
label: '故障时长', label: '故障时长',
minWidth: 90 minWidth: 90
}, },
{ {
prop: 'lossesNum1', prop: 'failurePercent',
label: '设备故障率', label: '设备故障率',
minWidth: 100 minWidth: 100
} }
] ]
const tableProps2 = [ const tableProps2 = [
{ {
prop: 'startTime', prop: 'month',
label: '月份', label: '月份',
width: 50 width: 60
}, },
{ {
prop: 'endTime', prop: 'value',
label: '设计产能', label: '设计产能',
minWidth: 80 minWidth: 80
} }
@ -169,6 +172,7 @@ export default {
children: 'children', children: 'children',
label: 'name' label: 'name'
}, },
unitName: '',
chooseMonth: '', chooseMonth: '',
formConfig: [ formConfig: [
{ {
@ -178,7 +182,8 @@ export default {
format: 'yyyy-MM', format: 'yyyy-MM',
valueFormat: 'yyyy-MM', valueFormat: 'yyyy-MM',
placeholder: '月份选择', placeholder: '月份选择',
param: 'testTime', param: 'timePosition',
defaultSelect: '',
width: 200 width: 200
}, },
{ {
@ -190,7 +195,9 @@ export default {
], ],
listQuery: { listQuery: {
current: 1, current: 1,
size: 500 size: 500,
timePosition: '',
name: ''
}, },
tableProps, tableProps,
tableData: [], tableData: [],
@ -206,61 +213,106 @@ export default {
window.addEventListener('resize', () => { window.addEventListener('resize', () => {
this.tableH = tableHeight(214) / 2 - 75 this.tableH = tableHeight(214) / 2 - 75
}) })
this.setDefaultVal()
this.getTree() this.getTree()
this.getList()
for (let i = 0; i < 30; i++) {
let obj = {}
obj.startTime = i
this.tableData.push(obj)
}
let arr = []
for (let i = 1; i < 13; i++) {
let obj = {}
obj.endTime = i
arr.push(obj)
}
this.tableData2 = arr.slice(0, 6)
this.tableData3 = arr.slice(6, 12)
}, },
methods: { methods: {
setDefaultVal() {
let date = new Date()
let year = date.getFullYear()
let month =
date.getMonth() + 1 < 10
? '0' + (date.getMonth() + 1)
: date.getMonth() + 1
this.formConfig[0].defaultSelect = year + '-' + month
this.listQuery.timePosition = year + '-' + month
},
getTree() { getTree() {
getTreeData().then((res) => { getTreeData().then((res) => {
this.treeData = res.data this.treeData = res.data
this.unitName = res.data[0].children[0].name
this.listQuery.name = this.unitName
setTimeout(() => {
this.$refs.deviceTree.setCurrentKey(this.unitName)
}, 100)
this.getList()
this.getPlan()
}) })
}, },
getList() { getList() {
// 获取设备OEE // 获取设备OEE
performanceAnalysisGet({ ...this.listQuery }).then((res) => { performanceAnalysisGet({ ...this.listQuery }).then((res) => {
console.log(res) if (res.code === 0) {
this.tableData = res.data
}
}) })
this.$refs.oeeLine.getChart()
}, },
buttonClick(val) { buttonClick(val) {
console.log(val) if (val.btnName === 'search') {
this.listQuery.timePosition = val.timePosition
this.getList()
this.getPlan()
}
}, },
getPlan() { getPlan() {
// 获取计划产能 // 获取计划产能
performanceAnalysisPlan({ name: '精切磨边', year: '2022' }).then( let date = new Date(this.listQuery.timePosition)
let year = date.getFullYear()
performanceAnalysisPlan({ name: this.unitName, year: year }).then(
(res) => { (res) => {
console.log(res) console.log(res)
if (res.code === 0 && !!res.data) {
let obj = res.data
let arr = [
{ month: '1月', value: '', type: 'january' },
{ month: '2月', value: '', type: 'february' },
{ month: '3月', value: '', type: 'march' },
{ month: '4月', value: '', type: 'april' },
{ month: '5月', value: '', type: 'may' },
{ month: '6月', value: '', type: 'june' },
{ month: '7月', value: '', type: 'july' },
{ month: '8月', value: '', type: 'august' },
{ month: '9月', value: '', type: 'september' },
{ month: '10月', value: '', type: 'october' },
{ month: '11月', value: '', type: 'november' },
{ month: '12月', value: '', type: 'december' }
]
for (let i = 0; i < arr.length; i++) {
arr[i].value = obj[arr[i].type]
}
this.tableData2 = arr.slice(0, 6)
this.tableData3 = arr.slice(6, 12)
}
} }
) )
}, },
clickDevice(val) { clickDevice(val) {
console.log(val) if (val.children && val.parent) {
if (!val.children) { // 单元
console.log(val.children) this.listQuery.name = val.name
this.unitName = val.name
this.getList()
this.getPlan()
} }
}, },
editPower() { editPower() {
this.centervisible = true this.centervisible = true
this.$nextTick(() => {
this.$refs.productPower.init(this.listQuery)
})
}, },
handleCancel() { handleCancel() {
this.$refs.productPower.formClear()
this.centervisible = false this.centervisible = false
}, },
handleConfirm() { handleConfirm() {
this.centervisible = false this.$refs.productPower.submitForm()
}, },
successSubmit() {} successSubmit() {
this.handleCancel()
this.getPlan()
}
} }
} }
</script> </script>
@ -268,7 +320,11 @@ export default {
.main-box { .main-box {
width: 100%; width: 100%;
padding: 0px 6px 0 16px; padding: 0px 6px 0 16px;
.left-box, .left-box {
padding-top: 16px;
border-radius: 8px;
background-color: #fff;
}
.top-left, .top-left,
.top-right, .top-right,
.right-bottom { .right-bottom {

130
src/views/qualityManagement/processFullInspection/particleLineChart.vue
View File

@ -14,7 +14,7 @@
import * as echarts from 'echarts' import * as echarts from 'echarts'
import { tableHeight } from '@/utils/index' import { tableHeight } from '@/utils/index'
import resize from '@/utils/chartMixins/resize' import resize from '@/utils/chartMixins/resize'
import { getProcessFull } from '@/api/qualityManagement' // import { getProcessFull } from '@/api/qualityManagement'
import moment from 'moment' import moment from 'moment'
export default { export default {
name: 'particleLineChart', name: 'particleLineChart',
@ -49,12 +49,8 @@ export default {
chartDom: '', chartDom: '',
chart: '', chart: '',
chartHeight: tableHeight(320), chartHeight: tableHeight(320),
listQuery: { checkOutTime: '',
size: 1000, maxLine: ''
current: 1,
checkOutTime: '',
maxLine: ''
}
} }
}, },
mounted() { mounted() {
@ -63,15 +59,15 @@ export default {
window.addEventListener('resize', () => { window.addEventListener('resize', () => {
this.chartHeight = tableHeight(320) this.chartHeight = tableHeight(320)
}) })
this.formConfig[0].defaultSelect = moment().format('YYYY-MM-DDTHH:mm:ss') this.formConfig[0].defaultSelect = moment().format('YYYY-MM-DD HH:mm:ss')
this.getMsg() this.getMsg()
}, },
methods: { methods: {
buttonClick(val) { buttonClick(val) {
console.log(val) console.log(val)
if (val.btnName === 'search') { if (val.btnName === 'search') {
this.listQuery.checkOutTime = val.checkOutTime this.checkOutTime = val.checkOutTime
this.listQuery.maxLine = val.maxLine this.maxLine = val.maxLine
this.getMsg() this.getMsg()
} }
}, },
@ -83,29 +79,44 @@ export default {
let xlList = [] let xlList = []
let sumList = [] let sumList = []
let msg = {} let msg = {}
getProcessFull({ ...this.listQuery }).then((res) => { for (let i = 0; i < 100; i++) {
console.log(res) time.push(moment().add(1, 'days').format('YYYY-MM-DD HH:mm:ss'))
if (res.code === 0 && res.data.length > 0) { sList.push(Math.floor(Math.random() * 80 + 10))
res.data.map((item) => { mList.push(Math.floor(Math.random() * 80 + 20))
console.log(item) lList.push(Math.floor(Math.random() * 80 + 30))
time.push(moment(item.hour).format('MM-DD HH:mm:ss')) xlList.push(Math.floor(Math.random() * 80 + 40))
sList.push(item.s) sumList.push(sList[i] + mList[i] + lList[i] + xlList[i])
mList.push(item.m) }
lList.push(item.l) msg.time = time
xlList.push(item.xl) msg.sList = sList
sumList.push(item.sum) msg.mList = mList
}) msg.lList = lList
msg.time = time msg.xlList = xlList
msg.sList = sList msg.sumList = sumList
msg.mList = mList this.getChart(msg)
msg.lList = lList // getProcessFull({ checkOutTime: this.checkOutTime }).then((res) => {
msg.xlList = xlList // console.log(res)
msg.sumList = sumList // if (res.code === 0 && res.data.length > 0) {
this.getChart(msg) // res.data.map((item) => {
} // console.log(item)
}) // time.push(moment(item.hour).format('MM-DD HH:mm:ss'))
// sList.push(item.s)
// mList.push(item.m)
// lList.push(item.l)
// xlList.push(item.xl)
// sumList.push(item.sum)
// })
// msg.time = time
// msg.sList = sList
// msg.mList = mList
// msg.lList = lList
// msg.xlList = xlList
// msg.sumList = sumList
// this.getChart(msg)
// }
// })
}, },
getChart(msg) { getChart1(msg) {
var option = { var option = {
color: ['#5AD8A6', '#5B8FF9', '#5D7092', '#F6BD16', '#E8684A'], color: ['#5AD8A6', '#5B8FF9', '#5D7092', '#F6BD16', '#E8684A'],
title: { title: {
@ -141,7 +152,7 @@ export default {
Symbol: 'none', Symbol: 'none',
label: { label: {
position: 'end', position: 'end',
formatter: '合格线\n' + this.listQuery.maxLine formatter: '合格线\n' + this.maxLine
}, },
data: [ data: [
{ {
@ -150,7 +161,7 @@ export default {
type: 'dashed', type: 'dashed',
color: '#0B58FF' color: '#0B58FF'
}, },
yAxis: this.listQuery.maxLine yAxis: this.maxLine
} }
] ]
} }
@ -178,6 +189,57 @@ export default {
] ]
} }
option && this.chart.setOption(option)
},
getChart(msg) {
console.log(msg)
var option = {
title: {
text: 'Beijing AQI',
left: '1%'
},
tooltip: {
trigger: 'axis'
},
grid: {
left: '5%',
right: '15%',
bottom: '10%'
},
xAxis: msg.time,
yAxis: {},
toolbox: {
right: 10,
feature: {
dataZoom: {
yAxisIndex: 'none'
},
restore: {},
saveAsImage: {}
}
},
dataZoom: [
{
startValue: '2014-06-01'
},
{
type: 'inside'
}
],
visualMap: {
top: 50,
right: 10,
outOfRange: {
color: '#999'
}
},
series: {
name: 'Beijing AQI',
type: 'line',
data: msg.sList
}
}
option && this.chart.setOption(option) option && this.chart.setOption(option)
} }
} }

2
vue.config.js
View File

@ -11,7 +11,7 @@ module.exports = defineConfig({
proxy: { proxy: {
'/api': { '/api': {
target: 'http://tft.mes.picaiba.com/api', target: 'http://tft.mes.picaiba.com/api',
// target: 'http://192.168.1.94:8080/api', // target: 'http://192.168.1.22:8080/api',
ws: true, ws: true,
changeOrigin: true, changeOrigin: true,
pathRewrite: { pathRewrite: {