likang

src/views/wind/worklocation/detail.vue

@@ -0,0 +1,442 @@
+<template>
+  <el-drawer
+    title="维保详情"
+    :visible.sync="drawerVisible"
+    :direction="direction"
+    size="60%"
+  >
+    <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
+      <el-tab-pane label="维保详情" name="first">
+        <el-divider content-position="left">基础信息</el-divider>
+        
+        <el-row>
+          <div style="margin-bottom: 30px; margin-left: 50px">
+            <el-col
+              :span="6"
+              style="margin-top: 10px; font-size: 14px; color: #a0a0a0"
+            >
+              <div class="detail-item">
+                <span>所属地区：</span>
+                <span class="item">{{ data.department_name }}</span>
+              </div>
+              <div class="detail-item">
+                <pre style="display: inline">工作位置：</pre>
+                <span class="item">{{ data.work_local_name }}</span>
+              </div>
+              <div class="detail-item">
+                <span>螺栓型号:</span>
+                <span class="item">{{ data.boit_type_name }}</span>
+              </div>
+              <div class="detail-item">
+                <pre style="display: inline">外      径:</pre>
+                <span class="item">{{ data.external_diameter }}</span>
+              </div>
+            </el-col>
+            <el-col
+              :span="6"
+              style="margin-top: 10px; font-size: 14px; color: #a0a0a0"
+            >
+              <div class="detail-item">
+                <pre style="display: inline">风场名称：</pre>
+                <span class="item">{{ data.wind_name }}</span>
+              </div>
+              <div class="detail-item">
+                <span>所属部件：</span>
+                <span class="item">{{data.parts_name}}</span>
+              </div>
+              <div class="detail-item">
+                <pre style="display: inline">扭    矩：</pre>
+                <span class="item">{{ data.torque }}</span>
+              </div>
+               <div class="detail-item">
+                <pre style="display: inline">维保时间：</pre>
+                <span class="item">{{ data.created_at }}</span>
+              </div>
+            </el-col>
+            <el-col
+              :span="6"
+              style="margin-top: 10px; font-size: 14px; color: #a0a0a0"
+            >
+              <div class="detail-item">
+                <pre style="display: inline">风机机位号：</pre>
+                <span class="item">{{ data.fan_number }}</span>
+              </div>
+              <div class="detail-item">
+                <span>螺栓样式：</span>
+                <span class="item">{{ data.bolt_style_name }}</span>
+              </div>
+              <div class="detail-item">
+                <pre style="display: inline">压   力：</pre>
+                <span class="item">{{ data.pressure }}</span>
+              </div>
+            </el-col>
+            <el-col :span="6"></el-col>
+          </div>
+        </el-row>
+        <!-- <el-divider content-position="left">规格信息</el-divider>
+        <el-row>
+          <div style="margin-bottom: 30px; margin-left: 50px">
+            <el-col
+              :span="24"
+              style="margin-top: 10px; font-size: 14px; color: #a0a0a0"
+            >
+              <div class="detail-item">
+                <pre style="display: inline">压力范围（PSI）：</pre>
+                <span class="item">{{ data.pressure_range }}</span>
+              </div>
+            </el-col>
+          </div>
+        </el-row> -->
+      </el-tab-pane>
+      <!-- <el-tab-pane label="使用扳手" name="second">
+        <el-table
+          :data="AssemblyData"
+          style="width: 100%; margin-left: 20px"
+          :row-class-name="tableRowClassName"
+        >
+          <el-table-column prop="number" label="编号"> </el-table-column>
+          <el-table-column prop="name" label="名称"> </el-table-column>
+          <el-table-column prop="model" label="型号"> </el-table-column>
+        </el-table>
+      </el-tab-pane>
+      <el-tab-pane label="螺栓紧固方案" name="third">
+        <el-divider content-position="left"><span style="color:#1850ef">单同步</span></el-divider>
+        <el-table
+          :data="oneData"
+          style="width: 100%;margin-left: 20px"
+        >
+          <el-table-column prop="step" label="步骤">
+          </el-table-column>
+          <el-table-column prop="number" label="螺栓编号">
+          </el-table-column>
+          <el-table-column prop="preload" label="标准预紧力（N*m）"> </el-table-column>
+        </el-table>
+        <el-divider content-position="left"><span style="color:#1850ef">两同步</span></el-divider>
+        <el-table
+          :data="twoData"
+          style="width: 100%;margin-left: 20px"
+        >
+          <el-table-column prop="step" label="步骤">
+          </el-table-column>
+          <el-table-column prop="number" label="螺栓编号">
+          </el-table-column>
+          <el-table-column prop="preload" label="标准预紧力（N*m）"> </el-table-column>
+        </el-table>
+        <el-divider content-position="left"><span style="color:#1850ef">四同步</span></el-divider>
+        <el-table
+          :data="fourData"
+          style="width: 100%;margin-left: 20px"
+        >
+          <el-table-column prop="step" label="步骤">
+          </el-table-column>
+          <el-table-column prop="number" label="螺栓编号">
+          </el-table-column>
+          <el-table-column prop="preload" label="标准预紧力（N*m）"> </el-table-column>
+        </el-table>
+        <el-divider content-position="left"><span style="color:#1850ef">六同步</span></el-divider>
+        <el-table
+          :data="sixData"
+          style="width: 100%;margin-left: 20px"
+        >
+          <el-table-column prop="step" label="步骤">
+          </el-table-column>
+          <el-table-column prop="number" label="螺栓编号">
+          </el-table-column>
+          <el-table-column prop="preload" label="标准预紧力（N*m）"> </el-table-column>
+        </el-table>
+      </el-tab-pane>
+      <el-tab-pane label="实时维保信息" name="fourth">
+           <el-table
+          :data="nowData"
+          style="width: 100%;margin-left: 20px"
+        >
+          <el-table-column prop="number" label="螺栓编号">
+          </el-table-column>
+          <el-table-column prop="real_preload" label="实际预紧力（N*m）">
+          </el-table-column>
+          <el-table-column prop="stand_preload" label="标准预紧力（N*m）">
+          </el-table-column>
+          <el-table-column prop="end_time" label="预紧结束时间">
+          </el-table-column>
+          <el-table-column prop="beng_no" label="液压泵编号">
+          </el-table-column>
+          <el-table-column prop="banshou_no" label="液压扳手编号">
+          </el-table-column>
+          <el-table-column prop="ways" label="紧固方式">
+          </el-table-column>
+          <el-table-column prop="operator" label="操作员"> </el-table-column>
+        </el-table>
+      </el-tab-pane>
+      <el-tab-pane label="历史维保记录" name="five">
+           <el-table
+          :data="historyData"
+          style="width: 100%;margin-left: 20px"
+        >
+         <el-table-column prop="number" label="螺栓编号">
+          </el-table-column>
+          <el-table-column prop="real_preload" label="实际预紧力（N*m）">
+          </el-table-column>
+          <el-table-column prop="stand_preload" label="标准预紧力（N*m）">
+          </el-table-column>
+          <el-table-column prop="end_time" label="预紧结束时间">
+          </el-table-column>
+          <el-table-column prop="beng_no" label="液压泵编号">
+          </el-table-column>
+          <el-table-column prop="banshou_no" label="液压扳手编号">
+          </el-table-column>
+          <el-table-column prop="ways" label="紧固方式">
+          </el-table-column>
+          <el-table-column prop="operator" label="操作员"> </el-table-column>
+        </el-table>
+      </el-tab-pane> -->
+    </el-tabs>
+  </el-drawer>
+</template>
+<script>
+export default {
+  props: ["detailVisible", "data"],
+  data() {
+    return {
+      drawer: false,
+      direction: "rtl",
+      activeName: "first",
+      AssemblyData: [
+        {
+          model: "v23300",
+          name: "测试工具1",
+          number: "2022030301",
+        },
+        {
+          model: "v23301",
+          name: "测试工具2",
+          number: "2022030302",
+        },
+        {
+          model: "v23302",
+          name: "测试工具3",
+          number: "2022030303",
+        },
+        {
+          model: "v23303",
+          name: "测试工具4",
+          number: "2022030304",
+        },
+      ],
+       oneData: [
+        {
+          step: 1,
+          preload: "2120",
+          number: "01",
+        },
+        {
+          step: 2,
+          preload: "2126",
+          number: "02",
+        }
+      ],
+      twoData: [
+        {
+          step: 1,
+          preload: "2128",
+          number: "03",
+        },
+        {
+          step: 2,
+          preload: "2100",
+          number: "04",
+        }
+      ],
+       fourData: [
+        {
+          step: 1,
+          preload: "2128",
+          number: "05",
+        },
+        {
+          step: 2,
+          preload: "2100",
+          number: "06",
+        }
+      ],
+       sixData: [
+        {
+          step: 1,
+          preload: "2128",
+          number: "07",
+        },
+        {
+          step: 2,
+          preload: "2100",
+          number: "08",
+        }
+      ],
+       nowData: [
+        {
+          number: '09',
+          real_preload: "2128",
+          stand_preload: "3000",
+          end_time:'2022-03-02 15:31:54',
+          beng_no:'200001',
+          banshou_no:'300001',
+          ways:'单同步',
+          operator:'张速'
+        },
+        {
+          number: 10,
+          real_preload: "2129",
+          stand_preload: "3001",
+          end_time:'2022-03-02 16:31:44',
+          beng_no:'200002',
+          banshou_no:'300002',
+          ways:'两同步',
+          operator:'张速'
+        },
+         {
+          number: 11,
+          real_preload: "2139",
+          stand_preload: "3002",
+          end_time:'2022-03-02 16:31:44',
+          beng_no:'200002',
+          banshou_no:'300002',
+          ways:'四同步',
+          operator:'张速'
+        },
+         {
+          number: 12,
+          real_preload: "2129",
+          stand_preload: "3003",
+          end_time:'2022-03-02 16:31:44',
+          beng_no:'200002',
+          banshou_no:'300002',
+          ways:'六同步',
+          operator:'张速'
+        }
+      ],
+       historyData: [
+        {
+          number: 13,
+          real_preload: "2128",
+          stand_preload: "3005",
+          end_time:'2022-03-02 15:31:54',
+          beng_no:'200001',
+          banshou_no:'300001',
+          ways:'单同步',
+          operator:'张速'
+        },
+        {
+          number: 14,
+          real_preload: "2129",
+          stand_preload: "3006",
+          end_time:'2022-03-02 16:31:44',
+          beng_no:'200002',
+          banshou_no:'300002',
+          ways:'两同步',
+          operator:'张速'
+        },
+         {
+          number: 15,
+          real_preload: "2139",
+          stand_preload: "3007",
+          end_time:'2022-03-02 16:31:44',
+          beng_no:'200002',
+          banshou_no:'300002',
+          ways:'四同步',
+          operator:'张速'
+        },
+         {
+          number: 16,
+          real_preload: "2129",
+          stand_preload: "3008",
+          end_time:'2022-03-02 16:31:44',
+          beng_no:'200002',
+          banshou_no:'300002',
+          ways:'六同步',
+          operator:'张速'
+        },
+         {
+          number: 17,
+          real_preload: "2128",
+          stand_preload: "3009",
+          end_time:'2022-03-02 15:31:54',
+          beng_no:'200001',
+          banshou_no:'300001',
+          ways:'单同步',
+          operator:'张速'
+        },
+        {
+          number: 18,
+          real_preload: "2129",
+          stand_preload: "3010",
+          end_time:'2022-03-02 16:31:44',
+          beng_no:'200002',
+          banshou_no:'300002',
+          ways:'两同步',
+          operator:'张速'
+        },
+         {
+          number: 19,
+          real_preload: "2139",
+          stand_preload: "3012",
+          end_time:'2022-03-02 16:31:44',
+          beng_no:'200002',
+          banshou_no:'300002',
+          ways:'四同步',
+          operator:'张速'
+        },
+         {
+          number: 20,
+          real_preload: "2129",
+          stand_preload: "3013",
+          end_time:'2022-03-02 16:31:44',
+          beng_no:'200002',
+          banshou_no:'300002',
+          ways:'六同步',
+          operator:'张速'
+        }
+      ],
+    };
+  },
+  methods: {
+    handleClick(tab, event) {
+      console.log(tab, event);
+    },
+    tableRowClassName({ row, rowIndex }) {
+      if (rowIndex === 1) {
+        return "warning-row";
+      } else if (rowIndex === 3) {
+        return "success-row";
+      }
+      return "";
+    },
+  },
+  computed: {
+    drawerVisible: {
+      set(val) {
+        this.$emit("sendVal", val); // 表示将子组件改变的值传递给父组件
+      },
+      get() {
+        return this.detailVisible; // 表示获取父组件的值
+      },
+    },
+  },
+};
+</script>
+<style scoped>
+.detail-item {
+  width: 100%;
+  padding: 15px 0px;
+  list-style-type: none;
+}
+.item {
+  font-size: 14px;
+  color: black;
+  margin-top: 5px;
+}
+.el-table .warning-row {
+  background: oldlace !important;
+}
+
+.el-table .success-row {
+  background: #f0f9eb !important;
+}
+</style>

src/views/wind/worklocation/index.vue

@@ -165,6 +165,16 @@
         fixed="left"
         width="55"
       ></el-table-column>
+
+      <el-table-column
+        prop="id"
+        label="序号"
+        align="center"
+        v-if="showColumn.id"
+        :show-overflow-tooltip="true"
+       
+      />
+
        <el-table-column
         prop="department_name"
         label="所属地区"
@@ -248,7 +258,7 @@
       />
        <el-table-column
         prop="created_at"
-        label="创建时间"
+        label="维保时间"
         align="center"
         v-if="showColumn.external_diameter"
         :show-overflow-tooltip="true"
@@ -259,7 +269,7 @@
         align="center"
         fixed="right"
       >
-        <template slot-scope="record">
+      <template slot-scope="record">
           <el-tooltip
             content="查看"
             placement="top"
@@ -269,10 +279,9 @@
               type="primary"
               size="mini"
               icon="el-icon-view"
-              @click="handleView(record.row)"
+              @click="handleDetail(record.row)"
             ></el-button>
           </el-tooltip>
-         
         </template>
       </el-table-column>
     </el-table>
@@ -281,9 +290,10 @@
         <div class="content">
           <div class="head">选择显示字段</div>
           <div class="body">
+            <el-checkbox v-model="checkList.id">序号</el-checkbox>
             <el-checkbox v-model="checkList.department_name">所属地区</el-checkbox>
-            <el-checkbox v-model="checkList.wind_name" disabled>风场名称</el-checkbox>
-            <el-checkbox v-model="checkList.fan_number" disabled>风机机位号</el-checkbox>
+            <el-checkbox v-model="checkList.wind_name">风场名称</el-checkbox>
+            <el-checkbox v-model="checkList.fan_number">风机机位号</el-checkbox>
             <el-checkbox v-model="checkList.number">编号</el-checkbox>
             <el-checkbox v-model="checkList.parts">所属部件</el-checkbox>
             <el-checkbox v-model="checkList.bolt_style">螺丝样式</el-checkbox>
@@ -321,11 +331,10 @@
       :layout="paginate.layout"
       :total="paginate.total"
     />
-     <form-model
-      @sendVal="closeDialog"
-      :formModelVisible="formVisible"
-      :title="title"
-      :ref="formName"
+    <detail
+      :detailVisible="detailVisible"
+       @sendVal="closeDrawer"
+       :data="detail"
     />
   </div>
 </template>
@@ -334,12 +343,14 @@
 import rlListOperate from "@/layout/rl-list-operate/rlListOperate";
 import { action } from "@/directive/permission/index.js";
 import formModel from './formModel.vue'
+import detail from "./detail.vue"
 export default {
   name: "workLocation",
   directives: { action },
   mixins: [rlListOperate],
   components: {
     formModel,
+    detail,
   },
   data() {
     return {
@@ -365,6 +376,7 @@ export default {
       departments: [],
       deviceModels:[],
 
+
       //详情
       detailVisible:false,
       detail:{},
@@ -373,6 +385,7 @@ export default {
       // 列的配置化对象，存储配置信息
       checkList: {},
       showColumn: {
+        id:true,
         department_name:false,
         wind_name:true,
         fan_number:true,
@@ -385,8 +398,6 @@ export default {
         pressure:true,
         external_diameter:true,
         created_at:true
-
-
       }
     };
   },
@@ -424,6 +435,11 @@ export default {
         searchBoxHeght.style.height = "auto";
       }
     },
+    handleDetail(row){
+      this.detailVisible = true,
+      this.detail = row
+      console.log(row);
+    },
     showColumnOption() {
       this.isShowColumn = true;
     },
@@ -470,6 +486,7 @@ export default {
       this.checkList = JSON.parse(localStorage.getItem("WorklocalSet"));
     } else {
       this.checkList = {
+        id:true,
         department_name:false,
          wind_name:true,
         fan_number:true,