| | |
| | | <!-- |
| | | * ......................................&&......................... |
| | | * ....................................&&&.......................... |
| | | * .................................&&&&............................ |
| | | * ...............................&&&&.............................. |
| | | * .............................&&&&&&.............................. |
| | | * ...........................&&&&&&....&&&..&&&&&&&&&&&&&&&........ |
| | | * ..................&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&.............. |
| | | * ................&...&&&&&&&&&&&&&&&&&&&&&&&&&&&&................. |
| | | * .......................&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&......... |
| | | * ...................&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&............... |
| | | * ..................&&& &&&&&&&&&&&&&&&&&&&&&&&&&&&&&............ |
| | | * ...............&&&&&@ &&&&&&&&&&..&&&&&&&&&&&&&&&&&&&........... |
| | | * ..............&&&&&&&&&&&&&&&.&&....&&&&&&&&&&&&&..&&&&&......... |
| | | * ..........&&&&&&&&&&&&&&&&&&...&.....&&&&&&&&&&&&&...&&&&........ |
| | | * ........&&&&&&&&&&&&&&&&&&&.........&&&&&&&&&&&&&&&....&&&....... |
| | | * .......&&&&&&&&.....................&&&&&&&&&&&&&&&&.....&&...... |
| | | * ........&&&&&.....................&&&&&&&&&&&&&&&&&&............. |
| | | * ..........&...................&&&&&&&&&&&&&&&&&&&&&&&............ |
| | | * ................&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&............ |
| | | * ..................&&&&&&&&&&&&&&&&&&&&&&&&&&&&..&&&&&............ |
| | | * ..............&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&....&&&&&............ |
| | | * ...........&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&......&&&&............ |
| | | * .........&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&.........&&&&............ |
| | | * .......&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&...........&&&&............ |
| | | * ......&&&&&&&&&&&&&&&&&&&...&&&&&&...............&&&............. |
| | | * .....&&&&&&&&&&&&&&&&............................&&.............. |
| | | * ....&&&&&&&&&&&&&&&.................&&........................... |
| | | * ...&&&&&&&&&&&&&&&.....................&&&&...................... |
| | | * ...&&&&&&&&&&.&&&........................&&&&&................... |
| | | * ..&&&&&&&&&&&..&&..........................&&&&&&&............... |
| | | * ..&&&&&&&&&&&&...&............&&&.....&&&&...&&&&&&&............. |
| | | * ..&&&&&&&&&&&&&.................&&&.....&&&&&&&&&&&&&&........... |
| | | * ..&&&&&&&&&&&&&&&&..............&&&&&&&&&&&&&&&&&&&&&&&&......... |
| | | * ..&&.&&&&&&&&&&&&&&&&&.........&&&&&&&&&&&&&&&&&&&&&&&&&&&....... |
| | | * ...&&..&&&&&&&&&&&&.........&&&&&&&&&&&&&&&&...&&&&&&&&&&&&...... |
| | | * ....&..&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&...........&&&&&&&&..... |
| | | * .......&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&..............&&&&&&&.... |
| | | * .......&&&&&.&&&&&&&&&&&&&&&&&&..&&&&&&&&...&..........&&&&&&.... |
| | | * ........&&&.....&&&&&&&&&&&&&.....&&&&&&&&&&...........&..&&&&... |
| | | * .......&&&........&&&.&&&&&&&&&.....&&&&&.................&&&&... |
| | | * .......&&&...............&&&&&&&.......&&&&&&&&............&&&... |
| | | * ........&&...................&&&&&&.........................&&&.. |
| | | * .........&.....................&&&&........................&&.... |
| | | * ...............................&&&.......................&&...... |
| | | * ................................&&......................&&....... |
| | | * .................................&&.............................. |
| | | * ..................................&.............................. |
| | | --> |
| | | |
| | | <!-- |
| | | * @Date: 2024-04-09 22:11:21 |
| | | * @LastEditors: Sneed |
| | | * @LastEditTime: 2024-04-26 21:23:30 |
| | | * @LastEditTime: 2024-06-25 19:22:46 |
| | | * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/mdc/processParam/index.vue |
| | | 实时看板 |
| | | --> |
| | |
| | | <el-col :span="4"> |
| | | <!-- <el-switch v-model="isShowTable" class="mb-2" active-text="数据表" inactive-text="统计图" /> --> |
| | | </el-col> |
| | | <el-col :span="20" style='text-align: right;'> |
| | | <el-col :span="18" style='text-align: right;'> |
| | | <el-date-picker :max-range="3" :clearable="true" value-format="YYYY-MM-DD" |
| | | style="width: 250px" v-model="time" type="daterange" range-separator="-" |
| | | start-placeholder="" end-placeholder="" :disabled-date="disabledDate" |
| | | @calendar-change="change" /> |
| | | </el-col> |
| | | <el-col :span="2" style='text-align: right;'> |
| | | <el-button type="primary" @click="exportExcel">导出</el-button> |
| | | </el-col> |
| | | </el-row> |
| | | <TimeLine v-model="timeRange" ref="timeLine"></TimeLine> |
| | |
| | | <div> |
| | | <el-button size="small" @click="viewData(item)">查看数据</el-button> |
| | | </div> |
| | | <scEcharts style="width:100%" height="200px" :option="item?.dayCharts"> |
| | | <scEcharts style="width:100%" :height="item.height" :option="item?.dayCharts"> |
| | | </scEcharts> |
| | | </div> |
| | | <el-empty v-else description="暂无数据" /> |
| | |
| | | </div> |
| | | </template> |
| | | </el-drawer> |
| | | <scDialog v-model="visible"> |
| | | <el-checkbox v-model="checkAll" :indeterminate="isIndeterminate" @change="handleCheckAllChange"> |
| | | 全选 |
| | | </el-checkbox> |
| | | <el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange"> |
| | | <el-checkbox v-for="city in list" :key="city.id" :label="city.id" :value="city.id"> |
| | | {{ city.description }} |
| | | </el-checkbox> |
| | | </el-checkbox-group> |
| | | <template #footer> |
| | | <el-button type="primary" @click="save">确定</el-button> |
| | | </template> |
| | | </scDialog> |
| | | </el-main> |
| | | </template> |
| | | |
| | |
| | | let min = moment(this.timeStart, 'YYYY-MM-DD').subtract(3, 'd').format('YYYY-MM-DD') |
| | | return !moment(Date).isBetween(min, max); |
| | | }, |
| | | visible: false, |
| | | checkAll: false, |
| | | isIndeterminate: false, |
| | | checkedCities: [] |
| | | } |
| | | }, |
| | | created() { |
| | |
| | | this.init() |
| | | }, |
| | | methods: { |
| | | handleCheckAllChange(val) { |
| | | this.checkedCities = val ? this.list.map(v => v.id) : [] |
| | | this.isIndeterminate = false |
| | | }, |
| | | handleCheckedCitiesChange(value) { |
| | | console.log(value) |
| | | this.checkAll = value.length === this.list.length |
| | | this.isIndeterminate = value.length > 0 && value.length < this.list.length |
| | | }, |
| | | save() { |
| | | console.log(this.checkedCities) |
| | | this.$HTTP.post(`/api/blade-mdc/process-parameter/excel/export`, { |
| | | collectItem: this.list.filter(v => this.checkedCities.includes(v.id)), |
| | | endTime: this.timeRange.endTime, |
| | | startTime: this.timeRange.startTime, |
| | | methodEnum: 'HOUR', |
| | | workstationId: this.treeChecked.toString(), |
| | | workstationName: '' |
| | | }).then(res => { |
| | | if (res.success) { |
| | | window.open(res.data.link) |
| | | } else { |
| | | this.$message.error(res.msg) |
| | | } |
| | | }) |
| | | }, |
| | | exportExcel() { |
| | | this.checkAll = false |
| | | this.isIndeterminate = false |
| | | this.checkedCities = [] |
| | | this.visible = true |
| | | }, |
| | | init() { |
| | | this.$HTTP.get('/api/blade-mdc/process-parameter').then(res => { |
| | | if (res.code === 200) { |
| | |
| | | }).then(res => { |
| | | if (res.code === 200) { |
| | | if (item.name !== 'DeviceStatus') { |
| | | this.tableData = res.data.records |
| | | this.tableData = res.data.records.map(v => { |
| | | return { |
| | | ...v, |
| | | } |
| | | }) |
| | | } else { |
| | | this.tableData = res.data.records.map(item => { |
| | | return { |
| | | ...item, |
| | | value: this.legend.find(v => v.code === item.value)?.name |
| | | } |
| | | }) |
| | | } |
| | | this.tableData = res.data.records.map(item => { |
| | | return { |
| | | ...item, |
| | | value: this.legend.find(v => v.code === item.value)?.name |
| | | } |
| | | }) |
| | | |
| | | this.drawer = true |
| | | } |
| | | }) |
| | |
| | | }) |
| | | this.$HTTP.get('/api/blade-mdc/process-parameter/param', { workstationId: this.treeChecked.toString() }).then(res => { |
| | | if (res.code === 200) { |
| | | this.list = res.data |
| | | console.log('jkjkjkjkj', this.list) |
| | | this.list = res.data.map(v => { |
| | | return { |
| | | ...v, |
| | | height: ['ProcessProgram', 'DeviceStatus'].includes(v.name) ? '100px' : '200px' |
| | | } |
| | | }) |
| | | this.queryChart() |
| | | } |
| | | }) |
| | |
| | | tooltip: { |
| | | position: ['50%', '50%'] |
| | | }, |
| | | legend: [ |
| | | ], |
| | | legend: {}, |
| | | title: { |
| | | text: '', |
| | | subtext: '', |
| | |
| | | { |
| | | data: yAxisData, |
| | | type: 'line', |
| | | |
| | | step: 'start', |
| | | } |
| | | ], |
| | | xAxis: { |
| | |
| | | setDeviceStatusOptions(data, myname) { |
| | | let total = Math.abs(moment(this.timeRange.startTime).diff(moment(this.timeRange.endTime))) |
| | | let start = this.timeRange.startTime |
| | | let len = data.data.length |
| | | if (moment(data.data[len - 1].time).unix() < moment(this.timeRange.endTime).unix()) { |
| | | let len = data?.data?.length |
| | | if (len > 0 && moment(data.data[len - 1].time).unix() < moment(this.timeRange.endTime).unix()) { |
| | | let addItem = { |
| | | time: this.timeRange.endTime, |
| | | value: data.data[len - 1].value |
| | |
| | | tooltip: { |
| | | show: true, |
| | | trigger: 'item', |
| | | // position: 'dom', |
| | | position: 'top', |
| | | triggerOn: 'click', |
| | | formatter: (value, ticket) => { |
| | | // console.log('----------1111') |
| | |
| | | // return current.format('HH:mm') |
| | | // return value |
| | | if (i == 0 || current === 0) return '' |
| | | return `${name}:开始时间${moment(data.data[i - 1].time).format('HH:mm')}-${moment(item.time).format('HH:mm')}` |
| | | return `${name}:时段${moment(data.data[i - 1].time).format('HH:mm')}-${moment(item.time).format('HH:mm')}` |
| | | } |
| | | }, |
| | | } |
| | |
| | | // return current.format('HH:mm') |
| | | // } |
| | | }, |
| | | legend: { |
| | | selectedMode: false |
| | | }, |
| | | title: { |
| | | text: '', |
| | | subtext: '', |