| | |
| | | * @Author: lzhe lzhe@example.com |
| | | * @Date: 2024-04-26 09:36:18 |
| | | * @LastEditors: lzhe lzhe@example.com |
| | | * @LastEditTime: 2024-04-26 18:07:52 |
| | | * @LastEditTime: 2024-05-14 18:41:53 |
| | | * @FilePath: /smart-web/src/views/mdc/status-record.vue |
| | | * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE |
| | | --> |
| | |
| | | </div> |
| | | <div class="footer"> |
| | | <el-button @click="query" type="primary">查询</el-button> |
| | | <el-button>导出</el-button> |
| | | <el-button @click="exportData">导出</el-button> |
| | | </div> |
| | | </div> |
| | | <div class="aposcope-right"> |
| | | <el-tabs tab-position="top" v-model="activeName" type="card"> |
| | | <el-tabs tab-position="top" v-model="activeName" type="card" @tab-change="tabChange"> |
| | | <el-tab-pane label="按日期查看" name="shift"> |
| | | <el-button-group> |
| | | <el-button @click="changeTab(item)" :type="btnListActive == item.id ? 'primary' : ''" v-for="item in btnList" :key="item.id" size="small">{{item.title }}</el-button> |
| | |
| | | <!-- collectionstatus 反馈状态 |
| | | date 日期 |
| | | workstationInfoList 工位list --> |
| | | <record-charts :collectionstatus="collectionstatus" :date="date" :workstationInfoList="workstationInfoList" v-if="collectionstatus.length != 0"></record-charts> |
| | | <record-charts-by-date :achievements="allwcs" :date="date" :workstationInfoList="workstationInfoList" v-if="achievements.length != 0"></record-charts-by-date> |
| | | </el-tab-pane> |
| | | <el-tab-pane label="按工位查看" name="time"> |
| | | 按工位查看 |
| | | <div class="fact-analysis-realtim"> |
| | | <div class="wimi-empty" v-if="isshowempty" style="background-color: rgb(255, 255, 255);"> |
| | | <div class="wimi-empty-img" style="width: 150px; height: 150px;"> |
| | | <img src="./quesheng.bd026700.png" style="height: auto; width: 100%;"> |
| | | </div> |
| | | <div class="empty-description"> |
| | | <div>暂无数据</div> |
| | | </div> |
| | | </div> |
| | | <div v-if="!isshowempty"> |
| | | <el-button-group> |
| | | <el-button @click="changeTabGongwei(item)" :type="btnGongweiListActive == item.id ? 'primary' : ''" v-for="item in btnGongweiList" :key="item.id" size="small">{{item.name }}</el-button> |
| | | </el-button-group> |
| | | <div class="status"> |
| | | <div class="status-wrap align-left"> |
| | | <div class="feed-button" @click="table_edit">状态反馈</div> |
| | | <div class="collect-status">采集状态</div> |
| | | <div class="status-box" v-for="item in achievements"><div class="status-color" :style="{'background-color': item.color}"></div>{{ item.name }}</div> |
| | | </div> |
| | | <div class="status-wrap"> |
| | | <el-checkbox v-model="checked1" label="人工反馈状态" size="large" /> |
| | | <div class="status-con"> |
| | | <div class="status-box" v-for="item in collectionstatus"><div class="status-color" :style="{'background-color': item.color}"></div>{{ item.name }}</div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <!-- setWork 入参 --> |
| | | <record-charts-by-workstation :setWork="setWork" :select="select" :achievements="allwcs" v-if="!isshowempty"></record-charts-by-workstation> |
| | | </div> |
| | | </div> |
| | | <save-dialog v-if="dialog.save" ref="saveDialog" @success="addfeedbackSuccess" :workstationId="lastLevelId" @closed="dialog.save=false"></save-dialog> |
| | | </el-tab-pane> |
| | | </el-tabs> |
| | | </div> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import saveDialog from './add-station-status' |
| | | import moment from 'moment'; |
| | | import MYTree from './MYTree.vue'; |
| | | import recordCharts from './components/recordCharts.vue'; |
| | | import recordChartsByDate from './components/recordChartsByDate.vue'; |
| | | import recordChartsByWorkstation from './components/recordChartsByWorkstation.vue'; |
| | | export default { |
| | | components: { |
| | | time: "", |
| | | MYTree, |
| | | recordCharts |
| | | recordChartsByDate, |
| | | recordChartsByWorkstation, |
| | | saveDialog |
| | | }, |
| | | watch: { |
| | | treeChecked(select) { |
| | |
| | | }, |
| | | data() { |
| | | return { |
| | | dialog: { |
| | | save: false |
| | | }, |
| | | isshowempty: true, |
| | | select: [], |
| | | workstationInfoList: [], |
| | | date: "", |
| | | checked1: true, |
| | | btnListActive: '', |
| | | btnGongweiListActive: "", |
| | | btnList: [], |
| | | btnGongweiList: [], |
| | | timeBtn: "", |
| | | shortcuts: [ |
| | | { |
| | |
| | | time: [], |
| | | treeChecked: [], |
| | | achievements: [], |
| | | collectionstatus: [] |
| | | collectionstatus: [], |
| | | workstationId: "", |
| | | setWork: {}, |
| | | allwcs: [] |
| | | } |
| | | }, |
| | | created() { |
| | |
| | | this.init(); |
| | | }, |
| | | methods: { |
| | | addfeedbackSuccess() { |
| | | var workstationName = ""; |
| | | this.btnGongweiList.forEach(item=> { |
| | | if(item.id == this.btnGongweiListActive) { |
| | | workstationName = item.name; |
| | | } |
| | | }) |
| | | this.setWork = { |
| | | endDate: this.time[1], |
| | | startDate: this.time[0], |
| | | humanFeedback: true, |
| | | machineFeedback: true, |
| | | workstationId: this.lastLevelId, |
| | | workstationName: workstationName |
| | | } |
| | | }, |
| | | table_edit(){ |
| | | this.dialog.save = true |
| | | this.$nextTick(() => { |
| | | this.$refs.saveDialog.open('edit').setData(this.lastLevelId); |
| | | }) |
| | | }, |
| | | tabChange(val) { |
| | | if(val == "time") { //按工位查看 |
| | | |
| | | }else if(val == "shift") { //按日期查看 |
| | | |
| | | } |
| | | }, |
| | | exportData() { //导出 |
| | | var obj = { |
| | | endTime: this.time[1], |
| | | startTime: this.time[0], |
| | | workstationInfoList: this.workstationInfoList |
| | | } |
| | | this.$HTTP.post(`/api/blade-mdc/status-record/excel/export`,obj).then(res=> { |
| | | if(res.code == 200) { |
| | | window.open(res.data.link); |
| | | } |
| | | }) |
| | | }, |
| | | changeTab(item) { |
| | | this.btnListActive = item.id; |
| | | this.date = item.id; |
| | | }, |
| | | changeTabGongwei(item) { //按工位查询 |
| | | this.btnGongweiListActive = item.id; |
| | | this.lastLevelId = this.btnGongweiListActive; |
| | | var workstationName = ""; |
| | | this.btnGongweiList.forEach(item=> { |
| | | if(item.id == this.btnGongweiListActive) { |
| | | workstationName = item.name; |
| | | } |
| | | }) |
| | | this.setWork = { |
| | | endDate: this.time[1], |
| | | startDate: this.time[0], |
| | | humanFeedback: true, |
| | | machineFeedback: true, |
| | | workstationId: item.id, |
| | | workstationName: workstationName |
| | | } |
| | | }, |
| | | getachievements() { //班次状态记录采集状态 |
| | | this.$HTTP.get(`/api/blade-cps/global_wcs/wcs-achievements`).then(res=> { |
| | |
| | | }) |
| | | this.achievements = achievements; |
| | | this.collectionstatus = collectionstatus; |
| | | this.allwcs = res.data; |
| | | } |
| | | }) |
| | | }, |
| | |
| | | query() { |
| | | this.getTime({endDate: this.time[1],startDate: this.time[0],statisticalMethod: 'SHIFT'}); |
| | | this.workstationInfoList = this.select; |
| | | if(this.select.length != 0) { //选了值显示工位 |
| | | this.btnGongweiList = this.select; |
| | | this.btnGongweiListActive = this.btnGongweiList[0].id; |
| | | this.lastLevelId = this.btnGongweiListActive; |
| | | this.setWork = { |
| | | endDate: this.time[1], |
| | | startDate: this.time[0], |
| | | humanFeedback: true, |
| | | machineFeedback: true, |
| | | workstationId: this.select[0].id, |
| | | workstationName: this.btnGongweiList[0].name |
| | | } |
| | | this.isshowempty = false; |
| | | } |
| | | } |
| | | } |
| | | } |
| | |
| | | z-index: 99; |
| | | } |
| | | .MYTree { |
| | | height: calc(100% - 200px); |
| | | height: 600px; |
| | | } |
| | | .MYTree-content { |
| | | height: 100%; |
| | | overflow: hidden; |
| | | overflow-y: auto; |
| | | } |
| | |
| | | flex-wrap: wrap; |
| | | } |
| | | .status-wrap /deep/ .el-checkbox.el-checkbox--large { |
| | | color: #3b8e8e; |
| | | color: #409eff; |
| | | } |
| | | .pagination { |
| | | text-align: right; |
| | | .fact-analysis-realtim { |
| | | display: flex; |
| | | justify-content: end; |
| | | flex-direction: row; |
| | | flex-wrap: wrap; |
| | | justify-content: flex-start; |
| | | align-content: flex-start; |
| | | box-sizing: border-box; |
| | | background: #fff; |
| | | height: 500px; |
| | | } |
| | | .wimi-empty { |
| | | height: 100%; |
| | | width: 100%; |
| | | display: flex; |
| | | border-radius: 2px; |
| | | flex-direction: column; |
| | | flex-wrap: nowrap; |
| | | align-content: center; |
| | | justify-content: center; |
| | | align-items: center; |
| | | } |
| | | .empty-description { |
| | | margin-bottom: 20px; |
| | | font-size: 14px; |
| | | color: #5e6d82; |
| | | margin-top: -16px; |
| | | line-height: 28px; |
| | | } |
| | | .feed-button { |
| | | position: absolute; |
| | | right: 10px; |
| | | top: -2px; |
| | | color: #409eff; |
| | | cursor: pointer; |
| | | } |
| | | .aposcope-right /deep/ .el-tabs__content { |
| | | overflow: visible; |
| | | } |
| | | </style> |