licp
2024-12-19 a1a287b479b0039c17c2fabdb7988a93ce7b25e3
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
<template>
  <div>
    <el-dialog :close-on-click-modal="false" :close-on-press-escape="false" :visible.sync="viewDeviceDialog" title="查看设备" width="80%" @close="closeDia">
      <div style="text-align: right;margin-bottom: 10px">
        <el-button size="small" type="primary" @click="addRow">添加</el-button>
        <el-button size="small" type="danger" @click="clearTable">清空</el-button>
      </div>
      <div>
        <el-table :data="machineAttachmentList" border height="500" style="width: 100%">
          <el-table-column header-align="center" label="名称" prop="machineName" width="200">
            <template slot="header" slot-scope="scope">
              <p>名称</p>
            </template>
            <template slot-scope="scope">
              <el-select v-model="scope.row.machineName"
                         class="table_input"
                         clearable
                         filterable
                         placeholder="设备名称"
                         size="small" @change="(val)=>changeMachineName(val, scope.$index)">
                <el-option v-for="item in equipOptions" :key="item.value"  :label="item.label" :value="item.value">
                  {{item.label + item.value}}
                </el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column header-align="center" label="型号规格" prop="machineSpecification" width="180">
            <template slot="header" slot-scope="scope">
              <p>型号规格</p>
            </template>
            <template slot-scope="{row}">
              <el-input v-model="row.machineSpecification" size="small"/>
            </template>
          </el-table-column>
          <el-table-column header-align="center" label="测量范围" prop="machineMeasuringRange">
            <template slot="header" slot-scope="scope">
              <p>测量范围</p>
            </template>
            <template slot-scope="{row}">
              <el-input v-model="row.machineMeasuringRange" size="small" type="textarea"/>
            </template>
          </el-table-column>
          <el-table-column header-align="center" label="①扩展不确定度②最大允差③准确度等级" prop="other">
            <template slot="header" slot-scope="scope">
              <p>①扩展不确定度②最大允差③准确度等级</p>
            </template>
            <template slot-scope="{row}">
              <el-input v-model="row.other" size="small" type="textarea"/>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="closeDia">取 消</el-button>
        <el-button type="primary" @click="handleDeviceInfo">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
 
<script>
export default {
  name: 'ViewDeviceDialog',
  // import 引入的组件需要注入到对象中才能使用
  components: {},
  data() {
    // 这里存放数据
    return {
      viewDeviceDialog: false,
      machineAttachmentList: [],
      equipOptions: [],
    };
  },
  // 方法集合
  methods: {
    openDia(info) {
      this.viewDeviceDialog = true
      this.machineAttachmentList = info.machineAttachmentList
      this.getEquipOptions()
    },
    // 增加表格行数据
    addRow () {
      this.machineAttachmentList.push({
        machineName: '',
        machineSpecification: '',
        machineMeasuringRange: '',
        other: '',
      })
    },
    // 清空表格数据
    clearTable () {
      this.machineAttachmentList = []
    },
    // 选择设备的回调
    changeMachineName (val, index) {
      const index1 = this.equipOptions.findIndex(item => item.value === val);
      if (index1 !== -1) {
        this.machineAttachmentList[index].deviceId = this.equipOptions[index1].id;
        this.machineAttachmentList[index].machineName = this.equipOptions[index1].deviceName;
      }
      this.machineAttachmentList[index].machineSpecification = val
    },
    // 提交设备信息
    handleDeviceInfo () {
      if (this.machineAttachmentList.length === 0) {
        this.$message.warning('请添加信息')
        return
      }
      this.viewDeviceDialog = false
      this.$emit('handleDeviceInfo', this.machineAttachmentList)
    },
    closeDia () {
      this.viewDeviceDialog = false
      this.$emit('closDeviceDia')
    },
    // 获取所有设备
    getEquipOptions() {
      this.equipOptions = []
      this.$axios.get(this.$api.deviceScope.deviceScopeSearch+'?status=0').then(res => {
        if (res.code === 200 && res.data) {
          this.equipOptions = res.data.map(m => {
            m.value = m.managementNumber
            m.label = m.deviceName
            return m
          })
        }
      }).catch(error => {
        console.error(error)
      })
    },
  }
};
</script>
 
<style scoped>
</style>