|
|
@@ -254,10 +254,12 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="right" style="flex: 1">
|
|
|
- <el-card class="box-card" style="margin: 10px; height: 800px">
|
|
|
- <div slot="header" class="clearfix">
|
|
|
- <span>八大步骤</span>
|
|
|
- </div>
|
|
|
+ <el-card class="box-card" style="margin: 10px; height: 800px;">
|
|
|
+<!-- <div slot="header" class="clearfix">-->
|
|
|
+<!-- <span>八大步骤</span>-->
|
|
|
+<!-- </div>-->
|
|
|
+ <el-tabs v-model="activeName" type="card" @tab-click="handleTabClick">
|
|
|
+ <el-tab-pane label="八大步骤" name="eightSteps">
|
|
|
<div
|
|
|
style="
|
|
|
width: 100%;
|
|
|
@@ -399,6 +401,44 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="作业日志" name="jobLogs">
|
|
|
+ <div class="joblogBox">
|
|
|
+ <div class="joblogCon">
|
|
|
+ <!--顶部日志内容-->
|
|
|
+ <div class="joblogTop">
|
|
|
+<!-- <p v-for="(item, index) in joblogList" :key="index">filteredJoblogList-->
|
|
|
+ <p v-for="(item, index) in filteredJoblogList" :key="index">
|
|
|
+ <span v-html="renderLogContent(item.operationContent)"></span>
|
|
|
+ </p>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <!-- 底部查询条件-->
|
|
|
+ <div class="bottomCheck">
|
|
|
+<!-- <el-checkbox :indeterminate="isIndeterminate" v-model="checkjobCheckAll" @change="handleCheckAllChange" class="big-checkbox">全选</el-checkbox>-->
|
|
|
+<!-- <div style="margin: 15px 0 15px 15px;"></div>-->
|
|
|
+<!-- <el-checkbox-group v-model="checkedJoblogs" @change="handleCheckedJoblogsChange" class="big-checkbox">-->
|
|
|
+<!-- <el-checkbox v-for="jobLogtype in jobLogtypes" :label="jobLogtype" :key="jobLogtype" class="big-checkbox">{{jobLogtype}}</el-checkbox>-->
|
|
|
+<!-- </el-checkbox-group>-->
|
|
|
+ <el-checkbox-group v-model="checkedJoblogs" @change="handleCheckedJoblogsChange" class="big-checkbox">
|
|
|
+ <el-checkbox
|
|
|
+ v-for="item in jobLogtypes"
|
|
|
+ :label="item.dictValue"
|
|
|
+ :key="item.dictValue"
|
|
|
+ class="big-checkbox"
|
|
|
+ >
|
|
|
+ {{ item.dictLabel }}
|
|
|
+ </el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+
|
|
|
+
|
|
|
<el-button style="float: right" type="primary" @click="finshJobticket"
|
|
|
>结束作业
|
|
|
</el-button>
|
|
|
@@ -409,6 +449,8 @@
|
|
|
>取消作业
|
|
|
</el-button>
|
|
|
</el-card>
|
|
|
+
|
|
|
+
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 添加或修改外部人员对话框 -->
|
|
|
@@ -850,7 +892,8 @@ import {
|
|
|
selectSopTypeByMachineryId,
|
|
|
updateJobStep,
|
|
|
updateJobToCancel,
|
|
|
- updateJobToFinish
|
|
|
+ updateJobToFinish,
|
|
|
+ getIsTicketOperLogPage
|
|
|
} from '@/api/mes/job/job'
|
|
|
import MapData from '@/views/mes/job/jobm/Mapdata.vue'
|
|
|
import { getUserList } from '@/api/mes/workCard'
|
|
|
@@ -860,7 +903,8 @@ import LockDetail from '@/views/mes/job/jobm/LockDetail.vue'
|
|
|
import { selectIsMapById } from '@/api/system/mapconfig'
|
|
|
import { getIsMapPointPage } from '@/api/system/mappoint'
|
|
|
import { getIsSystemAttributeByKey } from '@/api/system/configuration'
|
|
|
-
|
|
|
+import { getDicts } from '@/api/system/dict/data'
|
|
|
+const joblogsOptions = [];
|
|
|
export default {
|
|
|
name: 'NewSop',
|
|
|
components: { Template, MapData, LockDetail },
|
|
|
@@ -945,13 +989,26 @@ export default {
|
|
|
height: 25
|
|
|
},
|
|
|
loading: false,
|
|
|
- LoadStatus: ''//给LockDetail加弹窗加载
|
|
|
+ LoadStatus: '',//给LockDetail加弹窗加载
|
|
|
+ activeName: 'eightSteps', // 默认展示“八大步骤”
|
|
|
+ // 作业日志底部查询
|
|
|
+ checkJobCheckAll: false,
|
|
|
+ isIndeterminate: true,
|
|
|
+ checkedJoblogs: [],
|
|
|
+ jobLogtypes: [],
|
|
|
+ labelToValueMap: {},
|
|
|
+ joblogList:[]
|
|
|
+
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
|
isStepFourExecuted() {
|
|
|
const stepFour = this.EightStepForm.find((step) => step.stepIndex == '4')
|
|
|
return stepFour && stepFour.stepStatus === '1'
|
|
|
+ },
|
|
|
+ // 日志过滤方式
|
|
|
+ filteredJoblogList() {
|
|
|
+ return this.joblogList.filter(log => this.checkedJoblogs.includes(log.operationType?.toString()));
|
|
|
}
|
|
|
|
|
|
},
|
|
|
@@ -982,6 +1039,10 @@ export default {
|
|
|
this.getList()
|
|
|
|
|
|
},
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
methods: {
|
|
|
|
|
|
// 正在进行中作业票点击数字打开弹窗
|
|
|
@@ -1567,7 +1628,61 @@ export default {
|
|
|
query: { machineryId: this.machineryId }
|
|
|
})
|
|
|
}
|
|
|
+ },
|
|
|
+
|
|
|
+ // 作业日志tab点击事件
|
|
|
+ handleTabClick(tab) {
|
|
|
+ if (tab.name === 'jobLogs') {
|
|
|
+ const joblogdata = {
|
|
|
+ ticketId: this.ticketId,
|
|
|
+ current:1,
|
|
|
+ size:-1
|
|
|
+ }
|
|
|
+ getIsTicketOperLogPage(joblogdata).then((res) => {
|
|
|
+ this.joblogList=res.data.records
|
|
|
+ console.log(res,'查看作业日志',this.joblogList,'赋值成功了吗')
|
|
|
+ })
|
|
|
+ console.log(this.ticketId,'是否拿到了作业id')
|
|
|
+ }
|
|
|
+ getDicts('job_log_type').then(res => {
|
|
|
+ console.log(res, '字典值');
|
|
|
+ this.jobLogtypes = res.data;
|
|
|
+ // 初始化时默认选中全部（或部分）
|
|
|
+ this.checkedJoblogs = res.data.map(item => item.dictValue);
|
|
|
+ });
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ // 作业日志页面数据展示样式分割
|
|
|
+ renderLogContent(content) {
|
|
|
+ if (!content) return ''
|
|
|
+
|
|
|
+ // 第一步：先处理 <url>[label] 为 <img> + label
|
|
|
+ content = content.replace(/<([^>]+)>\[([^\]]+)\]/g, (match, url, label) => {
|
|
|
+ return `<img src="${url}" style="height: 25px; vertical-align: middle;"> <span style="color:#007BFF;margin: 0 3px">${label}</span>`
|
|
|
+ })
|
|
|
+
|
|
|
+ // 第二步：处理剩下的 [label]，转成蓝色字体
|
|
|
+ content = content.replace(/\[([^\]]+)\]/g, '<span style="color:#007BFF;margin: 0 5px">$1</span>')
|
|
|
+
|
|
|
+ return content
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ // 作业日志底部筛选功能
|
|
|
+ handleCheckAllChange(val) {
|
|
|
+ this.checkedJoblogs = val ? joblogsOptions : [];
|
|
|
+ this.isIndeterminate = false;
|
|
|
+ },
|
|
|
+ handleCheckedJoblogsChange(value) {
|
|
|
+ let checkedCount = value.length;
|
|
|
+ this.checkjobCheckAll = checkedCount === this.jobLogtypes.length;
|
|
|
+ this.isIndeterminate = checkedCount > 0 && checkedCount < this.jobLogtypes.length;
|
|
|
}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
@@ -1654,4 +1769,59 @@ div[ref="mapContainer"] {
|
|
|
height: 460px;
|
|
|
// background: blue;
|
|
|
}
|
|
|
+//作业日志
|
|
|
+.joblogBox {
|
|
|
+ width: 100%;
|
|
|
+ height: 80%;
|
|
|
+ margin: 0 auto 20px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ //background: pink;
|
|
|
+ .joblogCon{
|
|
|
+ width: 98%;
|
|
|
+ height: 80%;
|
|
|
+ margin: auto;
|
|
|
+ //background: greenyellow;
|
|
|
+ .joblogTop{
|
|
|
+ width: 100%;
|
|
|
+ height: 600px;
|
|
|
+ margin: auto;
|
|
|
+ overflow-y: auto;
|
|
|
+ //background: cadetblue;
|
|
|
+ p{
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .bottomCheck{
|
|
|
+ width:100%;
|
|
|
+ height: 50px;
|
|
|
+ line-height: 50px;
|
|
|
+ font-size: 23px;
|
|
|
+ display: flex;
|
|
|
+ margin: auto;
|
|
|
+ //background: forestgreen;
|
|
|
+
|
|
|
+ .big-checkbox {
|
|
|
+ font-size: 23px; /* 字体大小 */
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 调整实际复选框的大小 */
|
|
|
+ //.big-checkbox >>> .el-checkbox__inner {
|
|
|
+ // width: 25px;
|
|
|
+ // height: 25px;
|
|
|
+ //}
|
|
|
+ .big-checkbox ::v-deep(.el-checkbox__inner) {
|
|
|
+ width: 25px;
|
|
|
+ height: 25px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .big-checkbox >>> .el-checkbox__label {
|
|
|
+ font-size: 23px;
|
|
|
+ padding-left: 8px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+}
|
|
|
+}
|
|
|
</style>
|
