工机具台账

src/views/materialsStation/equipment/equipmentRecord/index.vue

@@ -1,12 +1,66 @@
 <template>
   <div class="app-container" id="">
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="90px">
-      <el-form-item label="关键字" prop="keyWord">
+      <el-form-item label="分公司" prop="impUnitName">
         <el-input
-          v-model="queryParams.keyWord"
+          v-model="queryParams.impUnitName"
-          placeholder="请输入关键字"
+          placeholder="请输入分公司"
           clearable
-          :maxlength="20"
+          :maxlength="50"
+          style="width: 240px"
+        />
+      </el-form-item>
+      <el-form-item label="项目部" prop="departName">
+        <el-input
+          v-model="queryParams.departName"
+          placeholder="请输入分公司"
+          clearable
+          :maxlength="50"
+          style="width: 240px"
+        />
+      </el-form-item>
+      <el-form-item label="工程" prop="proName">
+        <el-input
+          v-model="queryParams.proName"
+          placeholder="请输入工程"
+          clearable
+          :maxlength="50"
+          style="width: 240px"
+        />
+      </el-form-item>
+      <el-form-item label="分包单位" prop="subUnitName">
+        <el-input
+          v-model="queryParams.subUnitName"
+          placeholder="请输入分包单位"
+          clearable
+          :maxlength="50"
+          style="width: 240px"
+        />
+      </el-form-item>
+      <el-form-item label="班组名称" prop="teamName">
+        <el-input
+          v-model="queryParams.teamName"
+          placeholder="请输入班组名称"
+          clearable
+          :maxlength="50"
+          style="width: 240px"
+        />
+      </el-form-item>
+      <el-form-item label="物资名称" prop="typeName">
+        <el-input
+          v-model="queryParams.typeName"
+          placeholder="请输入物资名称"
+          clearable
+          :maxlength="50"
+          style="width: 240px"
+        />
+      </el-form-item>
+      <el-form-item label="规格型号" prop="typeModelName">
+        <el-input
+          v-model="queryParams.typeModelName"
+          placeholder="请输入规格型号"
+          clearable
+          :maxlength="50"
           style="width: 240px"
         />
       </el-form-item>
@@ -15,6 +69,39 @@
         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
+    <el-row :gutter="10" class="mb8">
+      <div class="tip-box-wrap">
+        <div class="tip-box">
+          <div class="tip-num">{{ tipForm.departNum || 0 }}</div>
+          <div class="tip-text">项目部总数</div>
+        </div>
+
+        <div class="tip-box">
+          <div class="tip-num">{{ tipForm.proNum || 0 }}</div>
+          <div class="tip-text">工程总数</div>
+        </div>
+
+        <div class="tip-box">
+          <div class="tip-num">{{ tipForm.teamNum || 0 }}</div>
+          <div class="tip-text">班组总数</div>
+        </div>
+
+        <div class="tip-box">
+          <div class="tip-num">{{ tipForm.allNum || 0 }}</div>
+          <div class="tip-text">总保有量</div>
+        </div>
+
+        <div class="tip-box">
+          <div class="tip-num">{{ tipForm.inNum || 0 }}</div>
+          <div class="tip-text">站内数量</div>
+        </div>
+
+        <div class="tip-box">
+          <div class="tip-num">{{ tipForm.useNum || 0 }}</div>
+          <div class="tip-text">在用数量</div>
+        </div>
+      </div>
+    </el-row>
     <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
         <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport">导出数据</el-button>
@@ -26,15 +113,28 @@
         label="序号"
         align="center"
         type="index"
-        :index="indexContinuation(queryParams.pageNum, queryParams.pageSize)"
+        :index="index => (queryParams.pageNum - 1) * queryParams.pageSize + index + 1"
       />
-      <el-table-column label="项目部名称" align="center" prop="proCenter" />
+      <el-table-column label="分公司" align="center" prop="impUnitName" width="200" />
-      <el-table-column label="工程名称" align="center" prop="proName">
+      <el-table-column label="项目部" align="center" prop="departName" width="200" />
-        <template v-slot="{ row }">
+      <el-table-column label="工程名称" align="center" prop="proName" width="200" />
-          <span @click="openProDetails(row)" style="color: #409eff; cursor: pointer">{{ row.proName }}</span>
+      <el-table-column label="分包单位" align="center" prop="subUnitName" width="200" />
+      <el-table-column label="班组名称" align="center" prop="teamName" />
+      <el-table-column label="物资名称" align="center" prop="typeName" :show-overflow-tooltip="true" />
+      <el-table-column label="规格型号" align="center" prop="typeModelName" :show-overflow-tooltip="true" />
+      <el-table-column label="计量单位" align="center" prop="unit" :show-overflow-tooltip="true" />
+      <el-table-column label="数量" align="center" prop="allNum" :show-overflow-tooltip="true">
+        <template slot-scope="scope">
+          <!-- 当 manageType 为 '编码' 时，使用可点击的 span -->
+          <span class="clickText" v-if="scope.row.manageType == '编码'" @click="openRecords(scope.row)">
+            {{ scope.row.allNum }}
+          </span>
+          <!-- 否则，直接显示数字 -->
+          <span v-else>
+            {{ scope.row.allNum }}
+          </span>
         </template>
       </el-table-column>
-      <el-table-column label="总保有量" align="center" prop="allNum" width="180" />
     </el-table>
     <pagination
       v-show="total > 0"
@@ -44,11 +144,54 @@
       :page-sizes="[10, 20, 50, 100]"
       @pagination="getList"
     />
+
+    <!-- 在库编码设备弹窗-->
+    <el-dialog :title="title" :visible.sync="openRecord" width="1200px" append-to-body>
+      <el-form :model="dialogQuery" ref="dialogQuery" size="small" :inline="true" label-width="80px">
+        <el-form-item label="关键字" prop="keyWord">
+          <el-input
+            v-model="dialogQuery.keyWord"
+            placeholder="请输入关键字"
+            clearable
+            :maxlength="30"
+            style="width: 240px"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleDialogQuery">查询</el-button>
+        </el-form-item>
+        <el-form-item>
+          <el-button icon="el-icon-download" size="mini" @click="handleDialogStoreExport">导出</el-button>
+        </el-form-item>
+      </el-form>
+
+      <el-table v-loading="loading" :data="dialogList">
+        <el-table-column
+          label="序号"
+          align="center"
+          width="80"
+          type="index"
+          :index="indexContinuation(dialogQuery.pageNum, dialogQuery.pageSize)"
+        ></el-table-column>
+        <el-table-column label="机具名称" align="center" prop="typeName" :show-overflow-tooltip="true" />
+        <el-table-column label="规格型号" align="center" prop="typeModelName" :show-overflow-tooltip="true" />
+        <el-table-column label="设备编码" align="center" prop="maCode" :show-overflow-tooltip="true" />
+        <el-table-column label="操作人" align="center" prop="inputUser" :show-overflow-tooltip="true" />
+        <el-table-column label="入库时间" align="center" prop="inputTime" :show-overflow-tooltip="true" />
+      </el-table>
+      <pagination
+        v-show="dialogTotal > 0"
+        :total="dialogTotal"
+        :page.sync="dialogQuery.pageNum"
+        :limit.sync="dialogQuery.pageSize"
+        @pagination="getStoreCodeList"
+      />
+    </el-dialog>
   </div>
 </template>
 
 <script>
-import { getProTotalListApi } from '@/api/materialsStation'
+import { getProTotalListApi, getStorageInfoListApi, getRetainedEquipmentListApi } from '@/api/materialsStation'
 export default {
   name: '',
   dicts: [],
@@ -58,6 +201,8 @@ export default {
       loading: false,
       // 选中数组
       ids: [],
+      // 弹出层标题
+      title: '查看',
       // 非单个禁用
       single: true,
       // 非多个禁用
@@ -72,8 +217,32 @@ export default {
       queryParams: {
         pageNum: 1,
         pageSize: 10,
-        keyWord: null
+        impUnitName: null,
-      }
+        departName: null,
+        proName: null,
+        subUnitName: null,
+        teamName: null,
+        typeName: null, //物资名称
+        typeModelName: null //规格型号
+      },
+      tipForm: {
+        departNum: 0, // 项目部总数
+        proNum: 0, // 工程总数
+        teamNum: 0, // 班组总数
+        allNum: 0, // 总保有量
+        inNum: 0, // 站内数量
+        useNum: 0 // 在用数量
+      },
+
+      //在库弹窗
+      openRecord: false,
+      dialogList: [], //在库编码设备列表
+      dialogQuery: {
+        pageNum: 1,
+        pageSize: 10,
+        keyWord: undefined
+      },
+      dialogTotal: 0
     }
   },
   created() {
@@ -84,18 +253,18 @@ export default {
     async getList() {
       this.loading = true
       const params = {
-        keyWord: this.queryParams.keyWord,
+        ...this.queryParams
-        pageSize: this.queryParams.pageSize,
-        pageNum: this.queryParams.pageNum
       }
       try {
-        const res = await getProTotalListApi(params)
+        const res = await getRetainedEquipmentListApi(params)
         this.tableList = res.data.rows || []
-        this.total = res.data.total || 0
         console.log('🚀 ~ getList ~ this.tableList:', this.tableList)
+        this.total = res.data.total || 0
+        const totalInfo = await getProTotalListApi(params)
+        this.tipForm = totalInfo.data
+        console.log('🚀 ~ getList ~ this.tableList:', this.tableList)
+        this.loading = false
       } catch (error) {
-        console.log('🚀 ~ getList ~ error:', error)
-      } finally {
         this.loading = false
       }
     },
@@ -112,23 +281,41 @@ export default {
     /** 导出按钮操作 */
     handleExport() {
       this.download(
-        'material/material_maMachine/exportTotalList',
+        'material/material_maMachine/exportRetainedEquipmentList',
         {
           ...this.queryParams
         },
-        `工器具台账_${new Date().getTime()}.xlsx`
+        `工机具台账_${new Date().getTime()}.xlsx`
       )
     },
-    // 工程详情
+    //查看在库编码数据
-    openProDetails(row) {
+    openRecords(row) {
-      this.$router.push({
+      this.openRecord = true
-        path: '/materialsStation/equipment/equipmentRecord/proDetails',
+      this.dialogQuery.keyWord = ''
-        query: {
+      this.dialogQuery.typeId = row.typeId
-          proId: row.proId,
+      this.dialogQuery.proId = row.proId
-          proCenter: row.proCenter
+      this.getStoreCodeList()
-        }
+    },
+    /** 查询在库编码列表 */
+    getStoreCodeList() {
+      getStorageInfoListApi(this.dialogQuery).then(response => {
+        this.dialogList = response.data.rows
+        this.dialogTotal = response.data.total
       })
+    },
+    /** 搜索在库按钮操作 */
+    handleDialogQuery() {
+      this.dialogQuery.pageNum = 1
+      this.getStoreCodeList()
+    },
+    handleDialogStoreExport() {
+      this.download(
+        'material/material_maMachine/exportStorageInfoList',
+        { ...this.dialogQuery },
+        `综合查询_在库设备_${new Date().getTime()}.xlsx`
+      )
     }
+    // ------------------
   }
 }
 </script>
@@ -141,4 +328,18 @@ export default {
   color: #02a7f0;
   cursor: pointer;
 }
+.tip-box-wrap {
+  display: flex;
+  justify-content: space-between;
+  .tip-box {
+    padding: 10px 30px;
+    background: #4cb1f9;
+    border-radius: 5px;
+    color: #fff;
+    text-align: center;
+    .tip-num {
+      font-size: 28px;
+    }
+  }
+}
 </style>