|
|
@@ -54,9 +54,32 @@
|
|
|
<span>八大步骤</span>
|
|
|
</div>
|
|
|
<div style="width:100%;height:100%;display:flex;justify-content:center;align-items:center;">
|
|
|
- <div style="width:700px;height:600px;background: pink;">
|
|
|
- <div style="width: 100%;height: 100px;background: yellow">
|
|
|
- <div></div>
|
|
|
+ <div style="width:700px;height:600px;">
|
|
|
+ <div style="width: 100%;height: 100px;">
|
|
|
+ <div>
|
|
|
+ <el-table :data="StepData">
|
|
|
+ <el-table-column label="" prop="step"></el-table-column>
|
|
|
+ <el-table-column label="" prop="number">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span v-if="scope.row.number!==null">
|
|
|
+ <i :class="scope.row.icon">{{scope.row.number}}</i>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="" prop="status">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span v-if="scope.row.status!=='已执行'">
|
|
|
+ <el-button type="primary" plain size="small">执行</el-button>
|
|
|
+ </span>
|
|
|
+ <span v-if="scope.row.status=='已执行'">
|
|
|
+ <span style="width: 20px;height: 20px;border-radius: 50%;background:#6aabfb"></span>
|
|
|
+ <span>{{scope.row.status}}</span>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="" prop="content" width="300"></el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -75,15 +98,70 @@ import {
|
|
|
import {
|
|
|
listTechnology
|
|
|
} from '@/api/system/technology'
|
|
|
+import Template from '@/views/print/printtemplate/list.vue'
|
|
|
|
|
|
export default {
|
|
|
name: 'NewSop',
|
|
|
+ components: { Template },
|
|
|
data() {
|
|
|
return {
|
|
|
sopStep: 'first',
|
|
|
selectedOption: '',
|
|
|
technologyList: [],
|
|
|
- marsDeptList: []
|
|
|
+ marsDeptList: [],
|
|
|
+ StepData: [
|
|
|
+ {
|
|
|
+ step: '第1步',
|
|
|
+ status: '已执行',
|
|
|
+ number:null,
|
|
|
+ content: '识别所要完成的工作内容'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ step: '第2步',
|
|
|
+ status: '已执行',
|
|
|
+ number:null,
|
|
|
+ content: '判断工作中锁设计的能量源及隔离方式'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ step: '第3步',
|
|
|
+ status: '分配',
|
|
|
+ number:'4',
|
|
|
+ icon:'el-icon-user',
|
|
|
+ content: '通知所有受影响的人'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ step: '第4步',
|
|
|
+ status: '已执行',
|
|
|
+ number: null,
|
|
|
+ content: '如果设备正在运行,按正常操作停机'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ step: '第5步',
|
|
|
+ status: '执行',
|
|
|
+ number:'0',
|
|
|
+ icon:'el-icon-lock',
|
|
|
+ content: '上锁并挂牌'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ step: '第6步',
|
|
|
+ status: '执行',
|
|
|
+ number:null,
|
|
|
+ content: '能量隔离证实'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ step: '第7步',
|
|
|
+ status: '执行',
|
|
|
+ number:null,
|
|
|
+ content: '取锁前的检查'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ step: '第8步',
|
|
|
+ status: '执行',
|
|
|
+ number:'0',
|
|
|
+ icon:'el-icon-unlock',
|
|
|
+ content: '拆除锁具,并把隔离开关恢复到正常位置'
|
|
|
+ }
|
|
|
+ ]
|
|
|
}
|
|
|
|
|
|
},
|