houzhongjian
2024-07-23 8501060c4f921d1e744c477e4dc08eb47b52693c
提交 | 用户 | 时间
850106 1 <template>
H 2   <el-dialog :visible.sync="visible" title="设备配置" :close-on-click-modal="false"
3              :close-on-press-escape="false">
4     <el-form :model="dataForm" ref="dataForm" @keyup.enter.native="dataFormSubmitHandle()"
5              :label-width="$i18n.locale === 'en-US' ? '160px' : '100px'">
6       <el-row>
7         <el-col :span="12">
8           <el-form-item label="主要设备" prop="isMain" label-width="auto">
9             <el-switch v-model="dataForm.isMain">
10             </el-switch>
11           </el-form-item>
12         </el-col>
13         <el-col :span="12">
14           <el-form-item label="日计划运行时间(小时)" prop="planTime" label-width="auto">
15             <el-input-number :disabled="!dataForm.isMain" v-model="dataForm.planTime" :min="1" :max="24">
16             </el-input-number>
17           </el-form-item>
18         </el-col>
19       </el-row>
20       <el-divider></el-divider>
21       <el-row>
22         <el-col :span="12">
23           <el-form-item label="设备计划使用年限(年)" prop="durableYears" label-width="auto">
24             <el-input-number v-model="dataForm.durableYears" :min="1" :max="100">
25             </el-input-number>
26           </el-form-item>
27         </el-col>
28       </el-row>
29       <el-row>
30         <el-col :span="20">
31             <el-form-item label="设备已使用时长" prop="useTime" label-width="auto">
32               <div style="display: flex;flex-direction: row;align-items: center;margin-bottom: 8px">
33                 <el-input-number v-model="year" controls-position="right" @change="timeChange('year')" :min="0" :max="100" size="small"></el-input-number>
34                 <div style="margin-right: 8px;font-size: 16px">
35                   <span>年</span>
36                 </div>
37                 <el-input-number v-model="month" controls-position="right" @change="timeChange('month')" :min="0" :max="12" size="small"></el-input-number>
38                 <div style="margin-right: 8px;font-size: 16px">
39                   <span>月</span>
40                 </div>
41                 <el-input-number v-model="day" controls-position="right" @change="timeChange('day')" :min="0" :max="31" size="small"></el-input-number>
42                 <div style="margin-right: 8px;font-size: 16px">
43                   <span>日</span>
44                 </div>
45                 <el-input-number v-model="hour" controls-position="right" @change="timeChange('hour')" :min="0" :max="24" size="small"></el-input-number>
46                 <div style="margin-right: 8px;font-size: 16px">
47                   <span>时</span>
48                 </div>
49                 <el-input-number v-model="minute" controls-position="right" @change="timeChange('minute')" :min="0" :max="60" size="small"></el-input-number>
50                 <div style="margin-right: 8px;font-size: 16px">
51                   <span>分</span>
52                 </div>
53               </div>
54               <el-input :disabled="true" v-model="dataForm.useTime" :min="0">
55                 <template slot="prepend">
56                   <i class="el-icon-refresh"></i>
57                   转化为分钟</template>
58                 <template slot="append">分钟</template>
59               </el-input>
60             </el-form-item>
61         </el-col>
62       </el-row>
63     </el-form>
64     <template slot="footer">
65       <el-button @click="visible = false">{{ $t('cancel') }}</el-button>
66       <el-button type="primary" @click="dataFormSubmitHandle()">{{ $t('confirm') }}</el-button>
67     </template>
68   </el-dialog>
69 </template>
70
71 <script>
72 import debounce from 'lodash/debounce'
73 import DictSelectTag from "@/components/dict/dict-select-tag.vue";
74
75 export default {
76   components: {DictSelectTag},
77   data() {
78     return {
79       visible: false,
80       loading: false,
81       dataForm: {
82         id: '',
83         planTime: 1,
84         durableYears: 1,
85         isMain: false,
86         useTime: 0
87       },
88       year: 0,
89       month: 0,
90       day: 0,
91       hour: 0,
92       minute: 0,
93     }
94   },
95   methods: {
96     init() {
97       this.visible = true
98       this.loading = true
99       this.getInfo()
100     },
101     // 获取信息
102     getInfo() {
103       this.$http.get(`/iailab-ntt-model/device/device-info/${this.dataForm.id}`).then(({data: res}) => {
104         if (res.code !== 0) {
105           return this.$message.error(res.msg)
106         }
107         const useTime = res.data.useTime;
108         this.year = Math.floor(useTime / (365 * 24 * 60))
109         this.month = Math.floor((useTime - (this.year * 365 * 24 * 60))/(30 *24*60))
110         this.day = Math.floor((useTime - (this.year * 365 * 24 * 60) - (this.month * 30 *24*60))/(24*60))
111         this.hour = Math.floor((useTime - (this.year * 365 * 24 * 60) - (this.month * 30 *24*60) - (this.day * 24*60))/60)
112         this.minute = useTime - (this.year * 365 * 24 * 60) - (this.month * 30 *24*60) - (this.day * 24*60) - (this.hour * 60)
113
114
115         this.dataForm = {
116           ...this.dataForm,
117           ...res.data
118         }
119         this.dataForm.isMain = this.dataForm.isMain === 1
120         this.loading = false
121       }).catch(() => {
122       })
123     },
124     // 表单提交
125     dataFormSubmitHandle: debounce(function () {
126       this.$refs['dataForm'].validate((valid) => {
127         if (!valid) {
128           return false
129         }
130         this.loading = true
131         this.dataForm.isMain = this.dataForm.isMain ? 1 : 0
132         this.dataForm.residueTime = this.dataForm.durableYears * 365 * 24 * 60 - this.dataForm.useTime
133         this.$http.post('/iailab-ntt-model/device/device-info/updatePlanTime', this.dataForm).then(({data: res}) => {
134           this.loading = false
135           if (res.code !== 0) {
136             return this.$message.error(res.msg)
137           }
138           this.$message({
139             message: this.$t('prompt.success'),
140             type: 'success',
141             duration: 500,
142             onClose: () => {
143               this.visible = false
144               this.$emit('refreshDataList')
145             }
146           })
147         }).catch(() => {
148         })
149       })
150     }, 1000, {'leading': true, 'trailing': false}),
151     timeChange() {
152       this.dataForm.useTime = this.year * 365 * 24 * 60 + this.month * 30 *24*60 + this.day *24*60 + this.hour *60 + this.minute
153     }
154   }
155 }
156 </script>