mts / MTS-UI · Files

<template>
  <div class="content">
    <div style="width: 100%;text-align: center;font-weight: 600;">每周特种设备（行车）安全检查记录</div>
    <table>
      <tr>
        <th>序号:</th>
        <th style="width: 19%;">检查因素:</th>
        <th style="width: 19%;">检查项目:</th>
        <th>检查内容:</th>
        <th>检查结果</th>
      </tr>
      <tr v-for="(item, index) in people" :key="index">
        <td class="font">{{ index + 1 }}</td>
        <td class="font">{{ item.checkFactors }}</td>
        <td class="font">{{ item.inspectionItems }}</td>
        <td class="font">{{ item.inspectionContent }}</td>

        <td :class="'text-center'">
          <select v-model="item.ischeck">
            <option value="1">✓</option>
            <option value="0" selected>✕</option>
          </select>
        </td>
      </tr>
      <tr>
        <td colspan="5">
          检查情况记录：
          <button @click="ww">清空</button>
          <br/>
          <textarea style="width: 98%;" name="" id="" cols="30" rows="10" v-model="record"> </textarea>
        </td>
      </tr>
      <tr>
        <td colspan="3">设备编号:
          <a-select
            show-search
            placeholder="请选择设备编号"
            option-filter-prop="children"
            :filter-option="filterOption"
            v-model="cloum20" style="width: 150px"
          >
            <a-select-option v-for="item in dictModel" :key="item.title" :value="item.value">{{
                item.text
              }}
            </a-select-option>
          </a-select>
        </td>
        <td colspan="3">特种设备安全总监:
          <a-input v-model="recorder" style="width: 40%"></a-input>
        </td>
      </tr>
      <tr>
        <td colspan="3">检查日期：
          <j-date v-model="recordDate"></j-date>
        </td>
      </tr>
      <tr style="height: 5px;">
        <td colspan="5" style="text-align: center;">
          <button style="width: 20rem;height: 3rem;" @click="submit">提交</button>
        </td>
      </tr>
    </table>
  </div>
</template>

<script>
import {addCheck, getDeviceDict} from '@/api/api'

export default {
  data() {
    return {
      recordDate: '',
      recorder: '',
      record: '',
      cloum20: '',
      dictModel: [],
      people: [
        {
          checkFactors: '管理因素',
          inspectionItems: '隐患排查',
          inspectionContent: `1)	定期开展安全隐患排查；
2)	及时消除安全隐患。
`,
          ischeck: 1,
        },
        {
          checkFactors: '管理因素',
          inspectionItems: '相关记录填写情况',
          inspectionContent: `1)	使用运行、维护保养、自行检查、运行故障和事故等记录应填写完整、字迹清晰、标识明确，相关人员签字确认，在保质期内妥善报管，便于查阅。
                                        2)	检查记录：特种设备安全管理人员应对在用特种设备至少每月进行一次自行检查并做好记录。
                                        3)	交接班记录：特种设备运行前、后及运行过程中，作业人员应对特种设备重要部位、仪表及其显示的参数进行检查和记录分析，做好运行值班记录和交接班记录。
                                        4)	维护保养记录：应按国家相关法规、安全技术规范和标准的规定，以及使用维护保养说明书要求，对特种设备进行日常维护保养，对发现的异常情况，应及时处理并且做好记录。
                                        5)	委托取得相应能力的单位进行日常维护保养，签订维护保养合同。
                                        `,
          ischeck: 1,
        },
        {
          checkFactors: '设备因素',
          inspectionItems: '金属结构',
          inspectionContent: `1)	主要受力结构件的连接焊缝无明显可见的裂纹。
                                        2)	主要受力结构断面有效厚度不低于设计厚度的90%。
                                        3)	螺栓和销轴等连接无明显松动、缺件、损坏等缺陷。
                                        `,
          ischeck: 1,
        },
        {
          checkFactors: '设备因素',
          inspectionItems: '主要零部件',
          inspectionContent: `1)	对各类起重机械的主要零部件（包括吊具、钢丝绳、滑轮、开式齿轮、卷筒、环链），按照相关安全技术规范及标准检查磨损、变形、缺损情况，并且判断是否可以继续使用。
2)	小车轨道和升降、横移导轨无明显松动或影响其安全运行的明显缺陷 `,
          ischeck: 1,
        },
        {
          checkFactors: '设备因素',
          inspectionItems: '制动器',
          inspectionContent: `1)	制动器的零件无裂纹、过度磨损（摩擦片磨损厚度的50%或者露出铆钉）、塑性变形、缺件等缺陷，液压制动器无漏油现象。
2)	制动器打开时制动轮与摩擦片无摩擦现象，制动器闭合时制动轮与摩擦片接触均匀，无影响制动性能的缺陷和油污。
3)	制动器的推动器无漏油现象。
 `,
          ischeck: 1,
        },
        {
          checkFactors: '设备因素',
          inspectionItems: '起升高度（下降高度）限位器',
          inspectionContent: `按照GB\T6067.1-2010 《起重机械安全规程  第1部分：总则》中9.2.1的规定设置了起升高度（下降高度）限位器。当吊具起升（下降）到极限位置时，能够自动切断动力源。                  `,
          ischeck: 1,
        },
        {
          checkFactors: '设备因素',
          inspectionItems: '报警装置',
          inspectionContent: `设置了蜂鸣器，闪光灯等作业报警装置`,
          ischeck: 1,
        },
        {
          checkFactors: '设备因素',
          inspectionItems: '缓冲器与端部止',
          inspectionContent: `1)	在轨道上运行的起重机的运行机构、起重小车的运行机构以及起重机的变幅机构等装设了缓冲器或缓冲装置（缓冲器或缓冲装置可以安装在起重机或者轨道端部止挡装置上）。
2)	轨道端部止挡装置牢固、可靠，能够防治起重机脱轨。
`,
          ischeck: 1,
        },
        {
          checkFactors: '设备因素',
          inspectionItems: '紧（应）急停止开关',
          inspectionContent: '起重机械紧（应）急4开关能够切断起重机械动力源，并且不能自动复位装设在方便司机操作的地方。',
          ischeck: 1,
        },
        {
          checkFactors: '设备因素',
          inspectionItems: '液压系统',
          inspectionContent: '符合一下要要求\n' +
            '1)\t平衡阀和液压锁与执行机构为刚性连接。\n' +
            '2)\t液压回路无漏油现象\n' +
            '3)\t液压缸安全限位装置、防爆阀（或截止阀）无损坏。\n',
          ischeck: 1,
        },
        {
          checkFactors: '设备运输',
          inspectionItems: '空载试验',
          inspectionContent: '按照起升（升降）、回转、变幅、小车（横向移动）、大车（纵向移动）顺序对各类起重机械进行空载试验，各操作装置标志完好、醒目。\n' +
            '1)\t各机构运转正常，控制可靠；\n' +
            '2)\t操纵系统、电气控制系统工作正常；\n' +
            '3)\t起重机械沿轨道全长无啃轨现象；\n' +
            '4)\t各自安全保护和防护装置工作可靠有效。\n',
          ischeck: 1,
        },
      ],
    }
  },
  created() {
    this.loadFrom()
  },
  methods: {
    loadFrom() {
      let params = {
        "type": 6
      }
      getDeviceDict(params).then((res) => {
        this.dictModel = res.result
      })
    },
    ww() {
      this.record = ''
    },
    submit() {
      let params = {
        'cloum1': this.people.length > 0 ? this.people[0].ischeck : null,
        'cloum2': this.people.length > 0 ? this.people[1].ischeck : null,
        'cloum3': this.people.length > 0 ? this.people[2].ischeck : null,
        'cloum4': this.people.length > 0 ? this.people[3].ischeck : null,
        'cloum5': this.people.length > 0 ? this.people[4].ischeck : null,
        'cloum6': this.people.length > 0 ? this.people[5].ischeck : null,
        'cloum7': this.people.length > 0 ? this.people[6].ischeck : null,
        'cloum8': this.people.length > 0 ? this.people[7].ischeck : null,
        'cloum9': this.people.length > 0 ? this.people[8].ischeck : null,
        'cloum10': this.people.length > 0 ? this.people[9].ischeck : null,
        'cloum11': this.people.length > 0 ? this.people[10].ischeck : null,
        'type': 6,
        'record': this.record,
        'recordDate': this.recordDate,
        'recorder': this.recorder,
        'cloum20': this.cloum20,
      }
      addCheck(params).then((res) => {
        if (res.success) {
          this.$message.success("提交成功!")
        }
      })
    },
  },
  mounted() {
  },

}
</script>

<style scoped>
.app-body {
  width: 100%;
  height: 100%;
}

.content {
  width: 99.1%;
  height: 100%;
  border: 1px solid yellowgreen;
  margin: 0 auto;
  overflow: auto;
}

body {
  font-size: 1rem;
}

table,
td,
th {
  border-collapse: collapse;
  border-spacing: 0;
}

table {
  width: 100%;
  margin-top: 10px;
}

td,
th {
  border: 2px solid #000000;
  padding: 5px 10px;
}

th {
  background: #42b983;
  /* font-size: 3vw; */
  font-weight: 400;
  color: #fff;
  cursor: pointer;
}

@media screen and (max-width: 400px) {
  .font {
    font-size: 2.8vw;
  }

  td,
  th {
    border: 2px solid #000000;
    padding: 5px 10px;
  }

  th {
    background: #42b983;
    font-size: 3vw;
    font-weight: 400;
    color: #fff;
    cursor: pointer;
  }
}

tr:nth-of-type(odd) {
  background: #fff;
}

tr:nth-of-type(even) {
  background: #eee;
}

button {
  outline: none;
  padding: 5px 8px;
  color: #fff;
  border: 1px solid #bcbcbc;
  border-radius: 3px;
  background-color: #009a61;
  cursor: pointer;
}

button:hover {
  opacity: 0.8;
}

.text-center {
  text-align: center;
}
</style>

<style lang="less">
.app_container {
  width: 100%;
  height: 100%;
  background: #ffff !important;
}
</style>