houzhongjian
2024-07-23 8501060c4f921d1e744c477e4dc08eb47b52693c
提交 | 用户 | 时间
850106 1 <template>
H 2   <el-card shadow="never" class="aui-card--fill">
3     <div class="mod-device__device-account}">
4       <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
5         <el-form-item>
6           <el-input v-model="dataForm.no" placeholder="设备编码" clearable></el-input>
7         </el-form-item>
8         <el-form-item>
9           <el-input v-model="dataForm.name" placeholder="设备名称" clearable></el-input>
10         </el-form-item>
11         <el-form-item>
12           <el-select v-model="dataForm.isMain" placeholder="主要设备" clearable>
13             <el-option
14                     v-for="item in isMainList"
15                     :key="item.code"
16                     :label="item.name"
17                     :value="item.code">
18             </el-option>
19           </el-select>
20         </el-form-item>
21         <el-form-item>
22           <el-button @click="getDataList()">{{ $t('query') }}</el-button>
23         </el-form-item>
24       </el-form>
25       <el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle"
26                 row-key="id"
27                 :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
28                 style="width: 100%;">
29         <el-table-column prop="no" label="设备编码" header-align="center" align="left" width="100"></el-table-column>
30         <el-table-column prop="name" label="设备名称" header-align="center" align="left"></el-table-column>
31         <el-table-column prop="className" label="所属类型" header-align="center" align="center"></el-table-column>
32         <el-table-column prop="workshop" label="所属车间" header-align="center" align="center"></el-table-column>
33         <el-table-column prop="planTime" label="日计划运行时间" header-align="center" align="center" width="170" :formatter="(row, column, cellValue, index) => planTimeFormat(row, column, cellValue, index,'小时')"></el-table-column>
34         <el-table-column prop="usageRate" label="日使用率" header-align="center" align="center" width="100" :formatter="usageFormat"></el-table-column>
35         <el-table-column prop="durableYears" label="设备计划使用年限" header-align="center" align="center" width="170" :formatter="(row, column, cellValue, index) => durableYearsFormat(row, column, cellValue, index,'年')"></el-table-column>
36         <el-table-column prop="newnessRate" label="设备新度系数" header-align="center" align="center" width="110" :formatter="newnessRateFormat"></el-table-column>
37         <el-table-column prop="residueTime" label="设备剩余时长" header-align="center" align="center" width="140" :formatter="minuteToYear"></el-table-column>
38         <el-table-column prop="updateDate" label="更新时间" header-align="center" align="center" min-width="150" :formatter="updateDateFormat"></el-table-column>
39         <el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="200">
40           <template slot-scope="scope">
41             <el-button v-if="scope.row.no" type="text" size="small" @click="updatePlanTime(scope.row.id)">{{ '修改' }}</el-button>
42             <el-button v-if="scope.row.no" type="text" size="small" @click="showTrend(scope.row.no,scope.row.name)">{{ '查看详情' }}</el-button>
43 <!--            <el-button v-if="scope.row.no" type="text" size="small" @click="viewHandle(scope.row.id,scope.row.deviceId)">{{ '设备指标配置' }}</el-button>-->
44           </template>
45         </el-table-column>
46       </el-table>
47       <el-pagination
48           :current-page="page"
49           :page-sizes="[10, 20, 50, 100]"
50           :page-size="limit"
51           :total="total"
52           layout="total, sizes, prev, pager, next, jumper"
53           @size-change="pageSizeChangeHandle"
54           @current-change="pageCurrentChangeHandle">
55       </el-pagination>
56       <!-- 弹窗, 新增 / 修改 -->
57       <device-health-evaluate-setting v-if="healthEvaluateSettingVisible" ref="healthEvaluateSetting"
58                                             @refreshDataList="getDataList"></device-health-evaluate-setting>
59       <device-plan-time-setting v-if="updatePlanTimeVisible" ref="planTimeSetting" @refreshDataList="getDataList"></device-plan-time-setting>
60       <device-trend  v-if="deviceTrendVisible" ref="deviceTrend"></device-trend>
61     </div>
62   </el-card>
63 </template>
64 <script>
65 import mixinViewModule from '@/mixins/view-module'
66 import DeviceAccountHistoryAddOrUpdate from "@/views/modules/decision/device-account-history-add-or-update.vue";
67 import DeviceHealthEvaluateSetting from "@/views/modules/decision/device-health-evaluate-setting.vue";
68 import DevicePlanTimeSetting from "@/views/modules/decision/device-plan-time-setting.vue";
69 import DeviceTrend from "@/views/modules/decision/device-trend.vue";
70
71 export default {
72   components: {DeviceHealthEvaluateSetting, DeviceAccountHistoryAddOrUpdate, DevicePlanTimeSetting, DeviceTrend},
73   mixins: [mixinViewModule],
74   data() {
75     return {
76       isMainList: [
77         {
78           code: 1,
79           name: '是'
80         },
81         {
82           code: 0,
83           name: '否'
84         }
85       ],
86       mixinViewModuleOptions: {
87         getDataListURL: '/iailab-ntt-model/device/device-info/page',
88         getDataListIsPage: true,
89       },
90       healthEvaluateSettingVisible: false,
91       updatePlanTimeVisible: false,
92       deviceTrendVisible: false,
93       dataForm: {
94         no: '',
95         name: ''
96       },
97       row: {},
98     }
99   },
100   methods: {
101     viewHandle(id,deviceId) {
102       this.healthEvaluateSettingVisible = true
103       this.$nextTick(() => {
104         this.$refs.healthEvaluateSetting.dataForm.id = id
105         this.$refs.healthEvaluateSetting.dataForm.deviceId = deviceId
106         this.$refs.healthEvaluateSetting.init()
107       })
108     },
109     updatePlanTime(id) {
110       this.updatePlanTimeVisible = true
111       this.$nextTick(() => {
112         this.$refs.planTimeSetting.dataForm.id = id
113         this.$refs.planTimeSetting.init()
114       })
115     },
116     showTrend(no,title) {
117       this.deviceTrendVisible = true
118       this.$nextTick(() => {
119         this.$refs.deviceTrend.dataForm.no = no
120         this.$refs.deviceTrend.title = title
121         this.$refs.deviceTrend.dataForm1.no = no
122         this.$refs.deviceTrend.init()
123       })
124     },
125     planTimeFormat(row, column, cellValue, index, unit) {
126       if (row.isMain === 1 && cellValue){
127         return cellValue + unit;
128       }else {
129         return '-'
130       }
131     },
132     durableYearsFormat(row, column, cellValue, index, unit) {
133       if (cellValue){
134         return cellValue + unit;
135       }else {
136         return '-'
137       }
138     },
139     usageFormat(row, column, cellValue, index) {
140       if (row.isMain === 1 && cellValue){
141         return Number(cellValue*100).toFixed(2) + '%'
142       }else {
143         return '-'
144       }
145     },
146     newnessRateFormat(row, column, cellValue, index) {
147       if (cellValue){
148         return Math.floor(Number(cellValue*100) * 100) / 100 + '%'
149       }else {
150         return '100%'
151       }
152     },
153     updateDateFormat(row, column, cellValue, index) {
154       return cellValue || '-'
155     },
156     minuteToYear(row, column, cellValue, index) {
157       if (cellValue){
158         if (cellValue % (365*24*60) === 0){
159           return Number(cellValue / (365*24*60) ).toFixed(0) + '年'
160         }
161         return Math.floor(Number(cellValue / (365*24*60)) * 10) / 10 + '年'
162       }else {
163         return '-'
164       }
165     }
166   }
167 }
168 </script>