2024-5-6 设备-保养报表页面调整+设备完好率报表调整

src/views/device/operation/index.vue

@@ -1,6 +1,13 @@
 <template>
   <div class="app-container">
-		<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+    <el-form
+      :model="queryParams"
+      ref="queryForm"
+      size="small"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
       <el-form-item label="车间" prop="workshop">
         <el-input
           v-model="queryParams.workshop"
@@ -41,7 +48,11 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-			<el-form-item v-if="false" label="实际运行时间;运行时间-故障时间" prop="actualOperationTime">
+      <el-form-item
+        v-if="false"
+        label="实际运行时间;运行时间-故障时间"
+        prop="actualOperationTime"
+      >
         <el-input
           v-model="queryParams.actualOperationTime"
           placeholder="请输入实际运行时间;运行时间-故障时间"
@@ -155,12 +166,21 @@
           start-placeholder="开始日期"
           end-placeholder="结束日期"
           value-format="yyyy-MM-dd"
-          :picker-options="pickerOptions">
+          :picker-options="pickerOptions"
+        >
         </el-date-picker>
       </el-form-item>
       <el-form-item>
-				<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button
-				<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+          type="primary"
+          icon="el-icon-search"
+          size="mini"
+          @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
+          >重置</el-button
+        >
       </el-form-item>
     </el-form>
 
@@ -173,7 +193,8 @@
           size="mini"
           @click="handleAdd"
           v-hasPermi="['device:operation:add']"
-				>新增</el-button>
+          >新增</el-button
+        >
       </el-col>
       <el-col :span="1.5">
         <el-button
@@ -184,7 +205,8 @@
           :disabled="single"
           @click="handleUpdate"
           v-hasPermi="['device:operation:edit']"
-				>修改</el-button>
+          >修改</el-button
+        >
       </el-col>
       <el-col :span="1.5">
         <el-button
@@ -195,7 +217,8 @@
           :disabled="multiple"
           @click="handleDelete"
           v-hasPermi="['device:operation:remove']"
-				>删除</el-button>
+          >删除</el-button
+        >
       </el-col>
       <el-col :span="1.5">
         <el-button
@@ -205,41 +228,166 @@
           size="mini"
           @click="handleExport"
           v-hasPermi="['device:operation:export']"
-				>导出</el-button>
+          >导出</el-button
+        >
       </el-col>
-			<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+      <right-toolbar
+        :showSearch.sync="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
     </el-row>
 
-		<el-table v-loading="loading" :data="operationList" @selection-change="handleSelectionChange">
+    <el-table
+      v-loading="loading"
+      :data="operationList"
+      @selection-change="handleSelectionChange"
+    >
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column v-if="false" label="主键" align="center" prop="id" />
-      <el-table-column width="60" align="center" label="序号" type="index"></el-table-column>
+      <el-table-column
-      <el-table-column v-if="false" width="100" label="工厂" align="center" prop="factoryCode" />
+        width="60"
-      <el-table-column width="120" label="日期" align="center" prop="createTime" >
+        align="center"
+        label="序号"
+        type="index"
+      ></el-table-column>
+      <el-table-column
+        v-if="false"
+        width="100"
+        label="工厂"
+        align="center"
+        prop="factoryCode"
+      />
+      <el-table-column
+        width="120"
+        label="日期"
+        align="center"
+        prop="createTime"
+      >
         <template slot-scope="scope">
-          <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
+          <span>{{ parseTime(scope.row.createTime, "{y}-{m}-{d}") }}</span>
         </template>
       </el-table-column>
-			<el-table-column width="120" label="车间" align="center" prop="workshop" />
+      <el-table-column
-			<el-table-column width="120" label="组线" align="center" prop="groupLine" />
+        width="120"
-			<el-table-column width="300" label="设备名称" align="left" prop="equipmentName" />
+        label="车间"
-			<el-table-column width="120" label="设备编码" align="center" prop="equipmentCode" />
+        align="center"
-			<el-table-column width="100" label="故障停机时间" align="center" prop="faultTime" />
+        prop="workshop"
-			<el-table-column width="100" label="实际运行时间" align="center" prop="actualOperationTime" />
+      />
-			<el-table-column width="100" label="运行时间" align="center" prop="operationTime" />
+      <el-table-column
-			<el-table-column width="100" label="故障率" align="center" prop="failureRate" />
+        width="120"
-			<el-table-column width="100" label="故障次数" align="center" prop="failureTimes" />
+        label="组线"
-			<el-table-column width="100" label="停机次数" align="center" prop="shutdownTimes" />
+        align="center"
-			<el-table-column width="200" label="故障描述" align="center" prop="failureDescription" />
+        prop="groupLine"
-			<el-table-column width="200" label="原因分析" align="center" prop="reasonAnalyze" />
+      />
-      <el-table-column width="200" label="设备状态描述" align="center" prop="equStatusDes" />
+      <el-table-column
-			<el-table-column width="200" label="处理方式" align="center" prop="handlingMethod" />
+        width="300"
-			<el-table-column width="200" label="更换备件" align="center" prop="replaceSpare" />
+        label="设备名称"
-      <el-table-column width="100" label="维修人" align="center" prop="repairPerson" />
+        align="left"
-			<el-table-column v-if="false" label="备用字段1" align="center" prop="attr1" />
+        prop="equipmentName"
-			<el-table-column v-if="false" label="备用字段2" align="center" prop="attr2" />
+      />
-			<el-table-column v-if="false" label="备用字段3" align="center" prop="attr3" />
+      <el-table-column
-			<el-table-column width="120" label="操作" align="center" class-name="small-padding fixed-width" fixed="right">
+        width="120"
+        label="设备编码"
+        align="center"
+        prop="equipmentCode"
+      />
+      <el-table-column
+        width="100"
+        label="故障停机时间"
+        align="center"
+        prop="faultTime"
+      />
+      <el-table-column
+        width="100"
+        label="实际运行时间"
+        align="center"
+        prop="actualOperationTime"
+      />
+      <el-table-column
+        width="100"
+        label="运行时间"
+        align="center"
+        prop="operationTime"
+      />
+      <el-table-column
+        width="100"
+        label="故障率"
+        align="center"
+        prop="failureRate"
+      />
+      <el-table-column
+        width="100"
+        label="故障次数"
+        align="center"
+        prop="failureTimes"
+      />
+      <el-table-column
+        width="100"
+        label="停机次数"
+        align="center"
+        prop="shutdownTimes"
+      />
+      <el-table-column
+        width="200"
+        label="故障描述"
+        align="left"
+        prop="failureDescription"
+      />
+      <el-table-column
+        width="200"
+        label="原因分析"
+        align="left"
+        prop="reasonAnalyze"
+      />
+      <el-table-column
+        width="200"
+        label="设备状态描述"
+        align="left"
+        prop="equStatusDes"
+      />
+      <el-table-column
+        width="200"
+        label="处理方式"
+        align="left"
+        prop="handlingMethod"
+      />
+      <el-table-column
+        width="200"
+        label="更换备件"
+        align="left"
+        prop="replaceSpare"
+      />
+      <el-table-column
+        width="100"
+        label="维修人"
+        align="left"
+        prop="repairPerson"
+      />
+      <el-table-column
+        v-if="false"
+        label="备用字段1"
+        align="center"
+        prop="attr1"
+      />
+      <el-table-column
+        v-if="false"
+        label="备用字段2"
+        align="center"
+        prop="attr2"
+      />
+      <el-table-column
+        v-if="false"
+        label="备用字段3"
+        align="center"
+        prop="attr3"
+      />
+      <el-table-column
+        width="120"
+        label="操作"
+        align="center"
+        class-name="small-padding fixed-width"
+        fixed="right"
+      >
         <template slot-scope="scope">
           <el-button
             size="mini"
@@ -247,7 +395,8 @@
             icon="el-icon-edit"
             @click="handleUpdate(scope.row)"
             v-hasPermi="['device:operation:edit']"
-					>修改</el-button>
+            >修改</el-button
+          >
           <el-button
             v-if="false"
             size="mini"
@@ -255,7 +404,8 @@
             icon="el-icon-delete"
             @click="handleDelete(scope.row)"
             v-hasPermi="['device:operation:remove']"
-					>删除</el-button>
+            >删除</el-button
+          >
         </template>
       </el-table-column>
     </el-table>
@@ -278,7 +428,11 @@
           <el-input v-model="form.groupLine" placeholder="请输入组线" />
         </el-form-item>
         <el-form-item label="设备" prop="equipmentName">
-					<el-input v-model="form.equipmentName" placeholder="请输入设备" :disabled="true"/>
+          <el-input
+            v-model="form.equipmentName"
+            placeholder="请输入设备"
+            :disabled="true"
+          />
         </el-form-item>
         <el-form-item v-if="false" label="设备编码" prop="equipmentCode">
           <el-input v-model="form.equipmentCode" placeholder="请输入设备编码" />
@@ -287,31 +441,62 @@
           <el-input v-model="form.faultTime" placeholder="请输入故障时间" />
         </el-form-item>
         <el-form-item label="实际运行时间" prop="actualOperationTime">
-					<el-input v-model="form.actualOperationTime" placeholder="请输入实际运行时间;运行时间-故障时间" />
+          <el-input
+            v-model="form.actualOperationTime"
+            placeholder="请输入实际运行时间;运行时间-故障时间"
+          />
         </el-form-item>
         <el-form-item label="运行时间" prop="operationTime">
           <el-input v-model="form.operationTime" placeholder="请输入运行时间" />
         </el-form-item>
         <el-form-item v-if="false" label="故障率" prop="failureRate">
-					<el-input v-model="form.failureRate" placeholder="请输入故障率" :disabled="true"/>
+          <el-input
+            v-model="form.failureRate"
+            placeholder="请输入故障率"
+            :disabled="true"
+          />
         </el-form-item>
         <el-form-item label="故障描述" prop="failureDescription">
-					<el-input v-model="form.failureDescription" placeholder="请输入故障描述" :disabled="true"/>
+          <el-input
+            v-model="form.failureDescription"
+            placeholder="请输入故障描述"
+            :disabled="true"
+          />
         </el-form-item>
         <el-form-item label="原因分析" prop="reasonAnalyze">
-					<el-input v-model="form.reasonAnalyze" placeholder="请输入原因分析" :disabled="true"/>
+          <el-input
+            v-model="form.reasonAnalyze"
+            placeholder="请输入原因分析"
+            :disabled="true"
+          />
         </el-form-item>
         <el-form-item label="处理方式" prop="handlingMethod">
-					<el-input v-model="form.handlingMethod" placeholder="请输入处理方式" :disabled="true"/>
+          <el-input
+            v-model="form.handlingMethod"
+            placeholder="请输入处理方式"
+            :disabled="true"
+          />
         </el-form-item>
         <el-form-item label="维修人" prop="repairPerson">
-					<el-input v-model="form.repairPerson" placeholder="请输入维修人" :disabled="true"/>
+          <el-input
+            v-model="form.repairPerson"
+            placeholder="请输入维修人"
+            :disabled="true"
+          />
         </el-form-item>
         <el-form-item label="设备状态描述" prop="equStatusDes">
-					<el-input v-model="form.equStatusDes" placeholder="请输入设备状态描述" :disabled="true"/>
+          <el-input
+            v-model="form.equStatusDes"
+            placeholder="请输入设备状态描述"
+            :disabled="true"
+          />
         </el-form-item>
         <el-form-item label="更换备件" prop="replaceSpare">
-					<el-input v-model="form.replaceSpare" placeholder="请输入更换备件" :disabled="true"/>
+          <el-input
+            v-model="form.replaceSpare"
+            placeholder="请输入更换备件"
+            :disabled="true"
+          />
         </el-form-item>
         <el-form-item v-if="false" label="工厂" prop="factoryCode">
           <el-input v-model="form.factoryCode" placeholder="请输入工厂" />
@@ -338,7 +523,13 @@
 </template>
 
 <script>
-import { listOperation, getOperation, delOperation, addOperation, updateOperation } from "@/api/device/operation";
+import {
+  listOperation,
+  getOperation,
+  delOperation,
+  addOperation,
+  updateOperation,
+} from "@/api/device/operation";
 import { parseTime } from "../../../utils/ruoyi";
 
 export default {
@@ -347,31 +538,35 @@ export default {
     return {
       // 日期范围选择快捷
       pickerOptions: {
-        shortcuts: [{
+        shortcuts: [
-          text: '最近一周',
+          {
+            text: "最近一周",
             onClick(picker) {
               const end = new Date();
               const start = new Date();
               start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
-            picker.$emit('pick', [start, end]);
+              picker.$emit("pick", [start, end]);
-          }
+            },
-        }, {
+          },
-          text: '最近一个月',
+          {
+            text: "最近一个月",
             onClick(picker) {
               const end = new Date();
               const start = new Date();
               start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
-            picker.$emit('pick', [start, end]);
+              picker.$emit("pick", [start, end]);
-          }
+            },
-        }, {
+          },
-          text: '最近三个月',
+          {
+            text: "最近三个月",
             onClick(picker) {
               const end = new Date();
               const start = new Date();
               start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
-            picker.$emit('pick', [start, end]);
+              picker.$emit("pick", [start, end]);
-          }
+            },
-        }]
+          },
+        ],
       },
       // 遮罩层
       loading: true,
@@ -420,9 +615,9 @@ export default {
       // 表单校验
       rules: {
         delFlag: [
-					{ required: true, message: "删除标识不能为空", trigger: "blur" }
+          { required: true, message: "删除标识不能为空", trigger: "blur" },
         ],
-			}
+      },
     };
   },
   created() {
@@ -433,7 +628,7 @@ export default {
     /** 查询设备运行记录列表 */
     getList() {
       this.loading = true;
-			listOperation(this.queryParams).then(response => {
+      listOperation(this.queryParams).then((response) => {
         this.operationList = response.rows;
         this.total = response.total;
         this.loading = false;
@@ -488,9 +683,9 @@ export default {
     },
     // 多选框选中数据
     handleSelectionChange(selection) {
-			this.ids = selection.map(item => item.id)
+      this.ids = selection.map((item) => item.id);
-			this.single = selection.length!==1
+      this.single = selection.length !== 1;
-			this.multiple = !selection.length
+      this.multiple = !selection.length;
     },
     /** 新增按钮操作 */
     handleAdd() {
@@ -501,8 +696,8 @@ export default {
     /** 修改按钮操作 */
     handleUpdate(row) {
       this.reset();
-			const id = row.id || this.ids
+      const id = row.id || this.ids;
-			getOperation(id).then(response => {
+      getOperation(id).then((response) => {
         this.form = response.data;
         this.open = true;
         this.title = "修改设备运行记录";
@@ -510,16 +705,16 @@ export default {
     },
     /** 提交按钮 */
     submitForm() {
-			this.$refs["form"].validate(valid => {
+      this.$refs["form"].validate((valid) => {
         if (valid) {
           if (this.form.id != null) {
-						updateOperation(this.form).then(response => {
+            updateOperation(this.form).then((response) => {
               this.$modal.msgSuccess("修改成功");
               this.open = false;
               this.getList();
             });
           } else {
-						addOperation(this.form).then(response => {
+            addOperation(this.form).then((response) => {
               this.$modal.msgSuccess("新增成功");
               this.open = false;
               this.getList();
@@ -531,19 +726,27 @@ export default {
     /** 删除按钮操作 */
     handleDelete(row) {
       const ids = row.id || this.ids;
-			this.$modal.confirm('是否确认删除设备运行记录编号为"' + ids + '"的数据项？').then(function() {
+      this.$modal
+        .confirm('是否确认删除设备运行记录编号为"' + ids + '"的数据项？')
+        .then(function () {
           return delOperation(ids);
-			}).then(() => {
+        })
+        .then(() => {
           this.getList();
           this.$modal.msgSuccess("删除成功");
-			}).catch(() => {});
+        })
+        .catch(() => {});
     },
     /** 导出按钮操作 */
     handleExport() {
-			this.download('device/operation/export', {
+      this.download(
-				...this.queryParams
+        "device/operation/export",
-			}, `operation_${new Date().getTime()}.xlsx`)
+        {
-		}
+          ...this.queryParams,
-	}
+        },
+        `operation_${new Date().getTime()}.xlsx`
+      );
+    },
+  },
 };
 </script>